Scott.Idem/OSIT-AE-App-Svelte
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Prettier for Journals

Browse Source
This commit is contained in:
Scott Idem
2026-03-24 12:25:22 -04:00
parent e1338b1a72
commit b74c6d0e9c
25 changed files with 3983 additions and 4238 deletions
Download Patch File Download Diff File Expand all files Collapse all files

198
src/routes/journals/[journal_id]/+layout.svelte
View File

@@ -1,83 +1,83 @@
<script lang="ts">
/** @type {import('./$types').LayoutProps} */
let log_lvl: number = $state(0);
/** @type {import('./$types').LayoutProps} */
let log_lvl: number = $state(0);
let { data, children } = $props();
let { data, children } = $props();
// *** Import Svelte specific
import { goto } from '$app/navigation';
// *** Import Svelte specific
import { goto } from '$app/navigation';
// *** Import other supporting libraries
import { FilePlus, Notebook, SquareLibrary, X } from '@lucide/svelte';
// *** Import other supporting libraries
import { FilePlus, Notebook, SquareLibrary, X } from '@lucide/svelte';
import { liveQuery } from 'dexie';
import { liveQuery } from 'dexie';
import { db_journals } from '$lib/ae_journals/db_journals';
import { ae_loc, ae_api, slct } from '$lib/stores/ae_stores';
import {
journals_loc,
journals_sess,
journals_slct
} from '$lib/ae_journals/ae_journals_stores';
import { journals_func } from '$lib/ae_journals/ae_journals_functions';
import type { ae_JournalEntry } from '$lib/types/ae_types';
import { db_journals } from '$lib/ae_journals/db_journals';
import { ae_loc, ae_api, slct } from '$lib/stores/ae_stores';
import {
journals_loc,
journals_sess,
journals_slct
} from '$lib/ae_journals/ae_journals_stores';
import { journals_func } from '$lib/ae_journals/ae_journals_functions';
import type { ae_JournalEntry } from '$lib/types/ae_types';
import Journal_entry_obj_qry from './../ae_comp__journal_entry_obj_qry.svelte';
import Journal_entry_obj_qry from './../ae_comp__journal_entry_obj_qry.svelte';
// NOTE: Derived from data.account_id (prop) instead of $slct.account_id (store)
// to prevent circular dependency loops during hydration.
let ae_acct = $derived(data[data.account_id]);
$effect(() => {
if (log_lvl) {
console.log(`ae_acct = `, ae_acct);
}
});
// NOTE: Derived from data.account_id (prop) instead of $slct.account_id (store)
// to prevent circular dependency loops during hydration.
let ae_acct = $derived(data[data.account_id]);
$effect(() => {
if (log_lvl) {
console.log(`ae_acct = `, ae_acct);
}
});
let show_menu__all_journals: boolean = $state(false);
let show_menu__all_journals: boolean = $state(false);
let lq__journal_obj = $derived(
liveQuery(async () => {
let results = await db_journals.journal.get(
$journals_slct?.journal_id ?? ''
); // null or undefined does not reset things like '' does
let lq__journal_obj = $derived(
liveQuery(async () => {
let results = await db_journals.journal.get(
$journals_slct?.journal_id ?? ''
); // null or undefined does not reset things like '' does
// Check if results are different than the current session version stored under $journals_slct
if ($journals_slct.journal_obj && results) {
if (
JSON.stringify($journals_slct.journal_obj) !==
JSON.stringify(results)
) {
$journals_slct.journal_obj = { ...results };
}
}
return results;
})
);
$effect(() => {
if (log_lvl) {
console.log(
`lq__journal_obj: journal_id = ${$journals_slct?.journal_id}`
);
console.log(`lq__journal_obj: results = `, lq__journal_obj);
if ($journals_slct.journal_obj && lq__journal_obj) {
if (
JSON.stringify($journals_slct.journal_obj) !==
JSON.stringify(lq__journal_obj)
) {
console.log(
`Session slct stored version has changed for ID = ${$journals_slct.journal_id}`,
$journals_slct.journal_obj
);
} else {
console.log(
`Session slct stored version has not changed for ID = ${$journals_slct.journal_id}`
);
}
// Check if results are different than the current session version stored under $journals_slct
if ($journals_slct.journal_obj && results) {
if (
JSON.stringify($journals_slct.journal_obj) !==
JSON.stringify(results)
) {
$journals_slct.journal_obj = { ...results };
}
}
});
return results;
})
);
$effect(() => {
if (log_lvl) {
console.log(
`lq__journal_obj: journal_id = ${$journals_slct?.journal_id}`
);
console.log(`lq__journal_obj: results = `, lq__journal_obj);
if ($journals_slct.journal_obj && lq__journal_obj) {
if (
JSON.stringify($journals_slct.journal_obj) !==
JSON.stringify(lq__journal_obj)
) {
console.log(
`Session slct stored version has changed for ID = ${$journals_slct.journal_id}`,
$journals_slct.journal_obj
);
} else {
console.log(
`Session slct stored version has not changed for ID = ${$journals_slct.journal_id}`
);
}
}
}
});
</script>
<!-- Svelte layout for a Journal ID page and children -->
@@ -85,29 +85,27 @@
class="
ae_journals__journal
mx-auto
flex flex-col grow gap-1
items-center
min-h-full
max-h-max
flex max-h-max min-h-full max-w-max
min-w-full
max-w-max
grow
flex-col
items-center
gap-1
space-y-2
"
>
">
<div
class="
flex flex-row flex-wrap
relative flex w-full
flex-row
flex-wrap items-center
justify-between
gap-1
items-center justify-between
border-gray-400
border-b
py-2
w-full
hover:bg-slate-100 hover:dark:bg-slate-700
border-gray-400
py-2 transition-all
relative transition-all
"
>
hover:bg-slate-100 hover:dark:bg-slate-700
">
<!-- If middle click then open the all journals page in a new tab. Otherwise show/hide the menu. -->
<button
type="button"
@@ -134,8 +132,7 @@
transition-all
"
title={`View all journals menu: "${$ae_loc?.user?.name}"
Middle-click to open in new tab`}
>
Middle-click to open in new tab`}>
<!-- <BookHeart /> -->
<!-- <Library /> -->
{#if show_menu__all_journals}
@@ -152,16 +149,15 @@ Middle-click to open in new tab`}
<div
class="
absolute top-12 left-0
p-4 z-50 w-80
space-y-0.5
bg-white dark:bg-gray-800
border border-gray-500
shadow-xl rounded-lg
z-50 w-80 max-w-fit
min-w-72
max-w-fit
space-y-0.5 rounded-lg
border border-gray-500
bg-white p-4
shadow-xl
dark:bg-gray-800
"
class:hidden={!show_menu__all_journals}
>
class:hidden={!show_menu__all_journals}>
<a
href="/journals"
class="
@@ -172,8 +168,7 @@ Middle-click to open in new tab`}
hover:preset-filled-tertiary-300-700
transition-all
"
title="View all journals for this account: {$ae_loc.account_name}"
>
title="View all journals for this account: {$ae_loc.account_name}">
<!-- <BookHeart /> -->
<!-- <Library /> -->
<SquareLibrary class="text-blue-500" />
@@ -195,12 +190,11 @@ Middle-click to open in new tab`}
}}
class="
form-select
border-neutral-400-600
w-full
border p-1
text-sm
border border-neutral-400-600
p-1
"
>
">
<option value="" disabled selected>
{Object.keys($journals_loc.entry_view_history_kv)
.length}&times; Recent Entries...
@@ -228,8 +222,7 @@ Middle-click to open in new tab`}
hover:preset-filled-tertiary-300-700
transition-all
"
title="View all journal entries for this journal: {$lq__journal_obj?.name}"
>
title="View all journal entries for this journal: {$lq__journal_obj?.name}">
<Notebook />
<!-- <Bookmark /> -->
<!-- <BookHeart class="m-1" /> -->
@@ -315,8 +308,7 @@ Middle-click to open in new tab`}
hover:preset-filled-tertiary-300-700
transition-all
"
title="Create a new journal entry for this journal: {$lq__journal_obj?.name}"
>
title="Create a new journal entry for this journal: {$lq__journal_obj?.name}">
<FilePlus />
<!-- <span class="fas fa-plus m-1"></span> -->
<span class="hidden sm:inline"> New Entry </span>

538
src/routes/journals/[journal_id]/+page.svelte
View File

@@ -1,295 +1,291 @@
<script lang="ts">
/** @type {import('./$types').PageData} */
let log_lvl: number = $state(0);
/** @type {import('./$types').PageData} */
let log_lvl: number = $state(0);
interface Props {
data: any;
}
interface Props {
data: any;
}
let { data }: Props = $props();
let { data }: Props = $props();
// *** Import Svelte specific
import { browser } from '$app/environment';
import { untrack } from 'svelte';
// *** Import Svelte specific
import { browser } from '$app/environment';
import { untrack } from 'svelte';
// *** Import other supporting libraries
import { liveQuery } from 'dexie';
// *** Import other supporting libraries
import { liveQuery } from 'dexie';
// *** Import Aether specific variables and functions
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/stores/ae_stores';
import { db_journals } from '$lib/ae_journals/db_journals';
import {
journals_loc,
journals_sess,
journals_slct,
journals_prom,
journals_trig
} from '$lib/ae_journals/ae_journals_stores';
import { journals_func } from '$lib/ae_journals/ae_journals_functions';
// *** Import Aether specific variables and functions
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/stores/ae_stores';
import { db_journals } from '$lib/ae_journals/db_journals';
import {
journals_loc,
journals_sess,
journals_slct,
journals_prom,
journals_trig
} from '$lib/ae_journals/ae_journals_stores';
import { journals_func } from '$lib/ae_journals/ae_journals_functions';
import AeCompJournalObjIdView from './../ae_comp__journal_obj_id_view.svelte';
import Journal_entry_obj_li_wrapper from './../ae_comp__journal_entry_obj_li_wrapper.svelte';
import AeCompModalJournalExport from '../ae_comp__modal_journal_export.svelte';
import AeCompModalJournalImport from '../ae_comp__modal_journal_import.svelte';
import AeCompJournalObjIdView from './../ae_comp__journal_obj_id_view.svelte';
import Journal_entry_obj_li_wrapper from './../ae_comp__journal_entry_obj_li_wrapper.svelte';
import AeCompModalJournalExport from '../ae_comp__modal_journal_export.svelte';
import AeCompModalJournalImport from '../ae_comp__modal_journal_import.svelte';
// Variables
let ae_acct = $derived(data[data.account_id]);
let show_export_modal = $state(false);
let show_import_modal = $state(false);
// Variables
let ae_acct = $derived(data[data.account_id]);
let show_export_modal = $state(false);
let show_import_modal = $state(false);
let search_id_li: Array<string> = $state([]);
let search_debounce_timer: any = null;
let last_search_id = 0;
let last_executed_key = ''; // Search Guard Key
let search_id_li: Array<string> = $state([]);
let search_debounce_timer: any = null;
let last_search_id = 0;
let last_executed_key = ''; // Search Guard Key
function handle_import_complete() {
// Trigger a refresh of the journal entry list
if ($journals_loc.entry.search_version === undefined)
$journals_loc.entry.search_version = 0;
$journals_loc.entry.search_version++;
}
function handle_import_complete() {
// Trigger a refresh of the journal entry list
if ($journals_loc.entry.search_version === undefined)
$journals_loc.entry.search_version = 0;
$journals_loc.entry.search_version++;
}
$effect(() => {
if (!ae_acct) return;
$effect(() => {
if (!ae_acct) return;
untrack(() => {
$journals_slct.journal_id = ae_acct.slct.journal_id;
$journals_slct.journal_entry_id = null;
});
});
let lq__journal_obj = $derived(
liveQuery(async () => {
return await db_journals.journal.get($journals_slct?.journal_id ?? '');
})
);
// Stable LiveQuery Pattern (Aether UI V3)
// Re-wrapped in $derived to ensure the observable instance remains stable
// unless the underlying dependencies (ids, search context) change.
// Important: keep the `liveQuery` closure free of transient reactive
// references — capture stable values (ids, search keys) so the observable
// isn't recreated unnecessarily on every render. Use `search_id_li` or
// other plain arrays/values as explicit dependencies.
let lq__journal_entry_obj_li = $derived(
liveQuery(async () => {
const ids = search_id_li;
const journal_id = $lq__journal_obj?.journal_id;
const search_text = $journals_loc.entry.qry__search_text;
const cat_code = $journals_loc.entry.qry__category_code;
// SCENARIO 1: Specific IDs provided (Search Results)
if (Array.isArray(ids) && ids.length > 0) {
if (log_lvl)
console.log(`Journal Page LQ: bulkGet ${ids.length} IDs`);
const results = await db_journals.journal_entry.bulkGet(ids);
return results.filter((item) => item !== undefined);
}
// SCENARIO 2: Fallback to broad search (Default view)
if (journal_id && !search_text && !cat_code) {
if (log_lvl)
console.log(
`Journal Page LQ: Fallback search for journal: ${journal_id}`
);
return await db_journals.journal_entry
.where('journal_id')
.equals(journal_id)
.reverse()
.sortBy('tmp_sort_1');
}
return [];
})
);
// Standardized Reactive Search Pattern (Aether UI V3)
// 1. Isolate dependencies into a stable derived object
let search_params = $derived({
v: $journals_loc.entry.search_version,
str: ($journals_loc.entry.qry__search_text ?? '').toLowerCase().trim(),
cat: $journals_loc.entry.qry__category_code,
limit: $journals_loc.entry.qry__limit,
enabled: $journals_loc.entry.qry__enabled,
hidden: $journals_loc.entry.qry__hidden,
journal_id: $journals_slct.journal_id,
person_id: $ae_loc.person_id,
remote_first: $journals_loc.entry.qry__remote_first
});
// 2. Controlled effect for triggering searches
$effect(() => {
// Establishes reactive dependency on search_params
const params = search_params;
if (search_debounce_timer) clearTimeout(search_debounce_timer);
search_debounce_timer = setTimeout(() => {
// Execution MUST be untracked to prevent circular triggers
untrack(() => {
$journals_slct.journal_id = ae_acct.slct.journal_id;
$journals_slct.journal_entry_id = null;
handle_search_refresh(params);
});
}, 250);
return () => {
if (search_debounce_timer) clearTimeout(search_debounce_timer);
};
});
async function handle_search_refresh(params: any) {
// 1. Guard: Check if criteria actually changed
const qry_key = JSON.stringify(params);
if (qry_key === last_executed_key) return;
last_executed_key = qry_key;
const current_search_id = ++last_search_id;
const journal_id = params.journal_id;
const remote_first = params.remote_first;
if (log_lvl)
console.log(
`[Journal Search #${current_search_id}] Refreshing entries (remote=${remote_first}, journal=${journal_id})...`
);
// 2. Setup State
untrack(() => {
$journals_sess.entry.qry__status = 'loading';
});
let lq__journal_obj = $derived(
liveQuery(async () => {
return await db_journals.journal.get(
$journals_slct?.journal_id ?? ''
);
})
);
const qry_str = params.str;
const cat_code = params.cat;
// Stable LiveQuery Pattern (Aether UI V3)
// Re-wrapped in $derived to ensure the observable instance remains stable
// unless the underlying dependencies (ids, search context) change.
// Important: keep the `liveQuery` closure free of transient reactive
// references — capture stable values (ids, search keys) so the observable
// isn't recreated unnecessarily on every render. Use `search_id_li` or
// other plain arrays/values as explicit dependencies.
let lq__journal_entry_obj_li = $derived(
liveQuery(async () => {
const ids = search_id_li;
const journal_id = $lq__journal_obj?.journal_id;
const search_text = $journals_loc.entry.qry__search_text;
const cat_code = $journals_loc.entry.qry__category_code;
let local_ids: string[] = [];
// SCENARIO 1: Specific IDs provided (Search Results)
if (Array.isArray(ids) && ids.length > 0) {
if (log_lvl)
console.log(`Journal Page LQ: bulkGet ${ids.length} IDs`);
const results = await db_journals.journal_entry.bulkGet(ids);
return results.filter((item) => item !== undefined);
}
// SCENARIO 2: Fallback to broad search (Default view)
if (journal_id && !search_text && !cat_code) {
if (log_lvl)
console.log(
`Journal Page LQ: Fallback search for journal: ${journal_id}`
);
return await db_journals.journal_entry
// 3. FAST PATH: Local IDB Search (SWR)
// We skip this ONLY if remote_first is checked AND we have search text
if (!remote_first) {
try {
if (journal_id) {
let local_results = await db_journals.journal_entry
.where('journal_id')
.equals(journal_id)
.reverse()
.sortBy('tmp_sort_1');
}
return [];
})
);
// Standardized Reactive Search Pattern (Aether UI V3)
// 1. Isolate dependencies into a stable derived object
let search_params = $derived({
v: $journals_loc.entry.search_version,
str: ($journals_loc.entry.qry__search_text ?? '').toLowerCase().trim(),
cat: $journals_loc.entry.qry__category_code,
limit: $journals_loc.entry.qry__limit,
enabled: $journals_loc.entry.qry__enabled,
hidden: $journals_loc.entry.qry__hidden,
journal_id: $journals_slct.journal_id,
person_id: $ae_loc.person_id,
remote_first: $journals_loc.entry.qry__remote_first
});
// 2. Controlled effect for triggering searches
$effect(() => {
// Establishes reactive dependency on search_params
const params = search_params;
if (search_debounce_timer) clearTimeout(search_debounce_timer);
search_debounce_timer = setTimeout(() => {
// Execution MUST be untracked to prevent circular triggers
untrack(() => {
handle_search_refresh(params);
});
}, 250);
return () => {
if (search_debounce_timer) clearTimeout(search_debounce_timer);
};
});
async function handle_search_refresh(params: any) {
// 1. Guard: Check if criteria actually changed
const qry_key = JSON.stringify(params);
if (qry_key === last_executed_key) return;
last_executed_key = qry_key;
const current_search_id = ++last_search_id;
const journal_id = params.journal_id;
const remote_first = params.remote_first;
if (log_lvl)
console.log(
`[Journal Search #${current_search_id}] Refreshing entries (remote=${remote_first}, journal=${journal_id})...`
);
// 2. Setup State
untrack(() => {
$journals_sess.entry.qry__status = 'loading';
});
const qry_str = params.str;
const cat_code = params.cat;
let local_ids: string[] = [];
// 3. FAST PATH: Local IDB Search (SWR)
// We skip this ONLY if remote_first is checked AND we have search text
if (!remote_first) {
try {
if (journal_id) {
let local_results = await db_journals.journal_entry
.where('journal_id')
.equals(journal_id)
.filter((entry) => {
if (cat_code && entry.category_code !== cat_code)
return false;
if (qry_str) {
const name = (entry.name ?? '').toLowerCase();
const content = (
entry.content ?? ''
).toLowerCase();
return (
name.includes(qry_str) ||
content.includes(qry_str)
);
}
return true;
})
.toArray();
local_results.sort((a, b) => {
const dateA = a.updated_on
? new Date(a.updated_on).getTime()
: 0;
const dateB = b.updated_on
? new Date(b.updated_on).getTime()
: 0;
return dateB - dateA;
});
local_ids = local_results
.map((e) => e.id || e.journal_entry_id)
.filter(Boolean);
if (current_search_id === last_search_id) {
if (log_lvl)
console.log(
`[Journal Search #${current_search_id}] Fast Path found ${local_ids.length} items locally.`
.filter((entry) => {
if (cat_code && entry.category_code !== cat_code)
return false;
if (qry_str) {
const name = (entry.name ?? '').toLowerCase();
const content = (entry.content ?? '').toLowerCase();
return (
name.includes(qry_str) ||
content.includes(qry_str)
);
untrack(() => {
search_id_li = local_ids;
if (local_ids.length > 0)
$journals_sess.entry.qry__status = 'done';
});
}
}
} catch (e) {
if (log_lvl) console.warn('Journal Fast Path failed.', e);
}
}
}
return true;
})
.toArray();
// 4. REVALIDATE: API Request
try {
const results = await journals_func.qry__journal_entry({
api_cfg: $ae_api,
journal_id: journal_id,
person_id: null,
qry_str: qry_str || null,
qry_category_code: cat_code || null,
enabled: params.enabled,
hidden: params.hidden,
limit: params.limit,
log_lvl: 0
});
local_results.sort((a, b) => {
const dateA = a.updated_on
? new Date(a.updated_on).getTime()
: 0;
const dateB = b.updated_on
? new Date(b.updated_on).getTime()
: 0;
return dateB - dateA;
});
if (current_search_id === last_search_id) {
const api_results = results || [];
const api_ids = api_results
.map((e: any) => e.id || e.journal_entry_id)
local_ids = local_results
.map((e) => e.id || e.journal_entry_id)
.filter(Boolean);
// Protect UI cache if API returns empty during revalidation
if (
api_ids.length === 0 &&
local_ids.length > 0 &&
!remote_first &&
!qry_str
) {
if (current_search_id === last_search_id) {
if (log_lvl)
console.log(
`[Journal Search #${current_search_id}] Fast Path found ${local_ids.length} items locally.`
);
untrack(() => {
$journals_sess.entry.qry__status = 'done';
});
return;
}
untrack(() => {
$journals_sess.entry_li = api_results;
search_id_li = api_ids;
$journals_sess.entry.qry__status = 'done';
});
if (log_lvl)
console.log(
`[Journal Search #${current_search_id}] Revalidation Complete. Found ${api_ids.length} items.`
);
}
} catch (error) {
if (current_search_id === last_search_id) {
console.error('Journal revalidation failed:', error);
untrack(() => {
$journals_sess.entry.qry__status = 'error';
if (search_id_li.length === 0 && local_ids.length > 0) {
search_id_li = local_ids;
}
});
if (local_ids.length > 0)
$journals_sess.entry.qry__status = 'done';
});
}
}
} catch (e) {
if (log_lvl) console.warn('Journal Fast Path failed.', e);
}
}
if (browser) {
window.parent.postMessage(
{ journal_id: $journals_slct?.journal_id ?? null },
'*'
);
}
// 4. REVALIDATE: API Request
try {
const results = await journals_func.qry__journal_entry({
api_cfg: $ae_api,
journal_id: journal_id,
person_id: null,
qry_str: qry_str || null,
qry_category_code: cat_code || null,
enabled: params.enabled,
hidden: params.hidden,
limit: params.limit,
log_lvl: 0
});
import { LoaderCircle } from '@lucide/svelte';
if (current_search_id === last_search_id) {
const api_results = results || [];
const api_ids = api_results
.map((e: any) => e.id || e.journal_entry_id)
.filter(Boolean);
// Protect UI cache if API returns empty during revalidation
if (
api_ids.length === 0 &&
local_ids.length > 0 &&
!remote_first &&
!qry_str
) {
untrack(() => {
$journals_sess.entry.qry__status = 'done';
});
return;
}
untrack(() => {
$journals_sess.entry_li = api_results;
search_id_li = api_ids;
$journals_sess.entry.qry__status = 'done';
});
if (log_lvl)
console.log(
`[Journal Search #${current_search_id}] Revalidation Complete. Found ${api_ids.length} items.`
);
}
} catch (error) {
if (current_search_id === last_search_id) {
console.error('Journal revalidation failed:', error);
untrack(() => {
$journals_sess.entry.qry__status = 'error';
if (search_id_li.length === 0 && local_ids.length > 0) {
search_id_li = local_ids;
}
});
}
}
}
if (browser) {
window.parent.postMessage(
{ journal_id: $journals_slct?.journal_id ?? null },
'*'
);
}
import { LoaderCircle } from '@lucide/svelte';
</script>
<svelte:head>
@@ -300,9 +296,8 @@
{#if $lq__journal_obj === undefined}
<div
class="flex flex-col items-center justify-center p-20 opacity-50 text-center"
>
<LoaderCircle size="3em" class="animate-spin mb-4 mx-auto" />
class="flex flex-col items-center justify-center p-20 text-center opacity-50">
<LoaderCircle size="3em" class="mx-auto mb-4 animate-spin" />
<p class="text-xl">Loading Journal...</p>
</div>
{:else if $ae_loc.person_id == $lq__journal_obj?.person_id}
@@ -310,32 +305,27 @@
{lq__journal_obj}
{lq__journal_entry_obj_li}
on_show_export={() => (show_export_modal = true)}
on_show_import={() => (show_import_modal = true)}
/>
on_show_import={() => (show_import_modal = true)} />
<Journal_entry_obj_li_wrapper
{lq__journal_obj}
{lq__journal_entry_obj_li}
show_found_header={false}
{log_lvl}
/>
{log_lvl} />
<AeCompModalJournalExport
bind:open={show_export_modal}
entries={$lq__journal_entry_obj_li ?? []}
journal={$lq__journal_obj}
on_close={() => (show_export_modal = false)}
/>
on_close={() => (show_export_modal = false)} />
<AeCompModalJournalImport
bind:open={show_import_modal}
on_close={() => (show_import_modal = false)}
on_import_complete={handle_import_complete}
/>
on_import_complete={handle_import_complete} />
{:else}
<section
class="main_content grow px-1 md:px-2 pb-28 flex flex-col gap-1 items-center"
>
class="main_content flex grow flex-col items-center gap-1 px-1 pb-28 md:px-2">
<p class="text-center">
You must be logged in as the owner to view this Journal.
</p>

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

@@ -1,264 +1,256 @@
<script lang="ts">
/** @type {import('./$types').PageData} */
let log_lvl: number = $state(0);
/** @type {import('./$types').PageData} */
let log_lvl: number = $state(0);
// *** Import Svelte specific
import { untrack } from 'svelte';
import { browser } from '$app/environment';
// *** Import Svelte specific
import { untrack } from 'svelte';
import { browser } from '$app/environment';
// *** Import other supporting libraries
import { liveQuery } from 'dexie';
// *** Import other supporting libraries
import { liveQuery } from 'dexie';
// *** Import Aether specific variables and functions
// import type { key_val } from '$lib/ae_stores';
import { ae_util } from '$lib/ae_utils/ae_utils';
// import { core_func } from '$lib/ae_core/ae_core_functions';
import { db_journals } from '$lib/ae_journals/db_journals';
import {
ae_loc,
ae_sess,
ae_api,
ae_trig,
} from '$lib/stores/ae_stores';
import {
journals_loc,
journals_sess,
journals_slct,
journals_prom,
journals_trig
} from '$lib/ae_journals/ae_journals_stores';
// *** Import Aether specific variables and functions
// import type { key_val } from '$lib/ae_stores';
import { ae_util } from '$lib/ae_utils/ae_utils';
// import { core_func } from '$lib/ae_core/ae_core_functions';
import { db_journals } from '$lib/ae_journals/db_journals';
import { ae_loc, ae_sess, ae_api, ae_trig } from '$lib/stores/ae_stores';
import {
journals_loc,
journals_sess,
journals_slct,
journals_prom,
journals_trig
} from '$lib/ae_journals/ae_journals_stores';
import Journal_entry_view from './../../../ae_comp__journal_entry_obj_id_view.svelte';
// import Element_data_store from '$lib/elements/element_data_store.svelte';
import AeCompModalJournalExport from '../../../ae_comp__modal_journal_export.svelte';
import Journal_entry_view from './../../../ae_comp__journal_entry_obj_id_view.svelte';
// import Element_data_store from '$lib/elements/element_data_store.svelte';
import AeCompModalJournalExport from '../../../ae_comp__modal_journal_export.svelte';
interface Props {
data: any;
interface Props {
data: any;
}
let { data }: Props = $props();
// let ae_promises: key_val = {};
// let ae_tmp: key_val = {};
// let ae_triggers: key_val = {};
// Variables
// *** Quickly pull out data from parent(s)
let ae_acct = $derived(data[data.account_id]);
let show_export_modal = $state(false);
$effect(() => {
if (!ae_acct) return;
if (log_lvl) console.log(`ae_acct = `, ae_acct);
untrack(() => {
$journals_slct.journal_id = ae_acct.slct.journal_id;
});
});
let lq__journal_obj = $derived(
liveQuery(async () => {
let results = await db_journals.journal.get(
$journals_slct?.journal_id ?? ''
); // null or undefined does not reset things like '' does
// Check if results are different than the current session version stored under $journals_slct
if ($journals_slct.journal_obj && results) {
if (
JSON.stringify($journals_slct.journal_obj) !==
JSON.stringify(results)
) {
$journals_slct.journal_obj = { ...results };
}
}
return results;
})
);
$effect(() => {
if (log_lvl) {
console.log(
`lq__journal_obj: journal_id = ${$journals_slct?.journal_id}`
);
console.log(`lq__journal_obj: results = `, lq__journal_obj);
if ($journals_slct.journal_obj && lq__journal_obj) {
if (
JSON.stringify($journals_slct.journal_obj) !==
JSON.stringify(lq__journal_obj)
) {
console.log(
`Session slct stored version has changed for ID = ${$journals_slct.journal_id}`,
$journals_slct.journal_obj
);
} else {
console.log(
`Session slct stored version has not changed for ID = ${$journals_slct.journal_id}`
);
}
}
}
});
let { data }: Props = $props();
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');
// let ae_promises: key_val = {};
// let ae_tmp: key_val = {};
// let ae_triggers: key_val = {};
// Check if results are different than the current session version stored under $journals_slct
if (
$journals_slct.journal_obj_li &&
JSON.stringify($journals_slct.journal_obj_li) !==
JSON.stringify(results)
) {
$journals_slct.journal_obj_li = [...results];
}
// Variables
// *** Quickly pull out data from parent(s)
let ae_acct = $derived(data[data.account_id]);
let show_export_modal = $state(false);
return results;
})
);
$effect(() => {
if (!ae_acct) return;
if (log_lvl) console.log(`ae_acct = `, ae_acct);
untrack(() => {
$journals_slct.journal_id = ae_acct.slct.journal_id;
});
});
let lq__journal_obj = $derived(
liveQuery(async () => {
let results = await db_journals.journal.get(
$journals_slct?.journal_id ?? ''
); // null or undefined does not reset things like '' does
// Check if results are different than the current session version stored under $journals_slct
if ($journals_slct.journal_obj && results) {
if (
JSON.stringify($journals_slct.journal_obj) !==
JSON.stringify(results)
) {
$journals_slct.journal_obj = { ...results };
}
}
return results;
})
);
$effect(() => {
if (log_lvl) {
$effect(() => {
if (log_lvl) {
console.log(`lq__journal_obj_li: person_id = ${$ae_loc.person_id}`);
console.log(`lq__journal_obj_li: results = `, lq__journal_obj_li);
if (
$journals_slct.journal_obj_li &&
JSON.stringify($journals_slct.journal_obj_li) !==
JSON.stringify(lq__journal_obj_li)
) {
console.log(
`lq__journal_obj: journal_id = ${$journals_slct?.journal_id}`
`Session slct li stored version has changed for ID = ${$ae_loc.person_id}`,
$journals_slct.journal_obj_li
);
console.log(`lq__journal_obj: results = `, lq__journal_obj);
if ($journals_slct.journal_obj && lq__journal_obj) {
if (
JSON.stringify($journals_slct.journal_obj) !==
JSON.stringify(lq__journal_obj)
) {
console.log(
`Session slct stored version has changed for ID = ${$journals_slct.journal_id}`,
$journals_slct.journal_obj
);
} else {
console.log(
`Session slct stored version has not changed for ID = ${$journals_slct.journal_id}`
);
}
} else {
if (log_lvl > 1) {
console.log(
`Session slct li stored version has not changed for ID = ${$ae_loc.person_id}`
);
}
}
}
});
// 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
// NOTE: This must remain reactive (in an effect) so it updates on same-route navigation.
$effect(() => {
if (!ae_acct) return;
untrack(() => {
$journals_slct.journal_entry_id = ae_acct.slct.journal_entry_id;
// $journals_slct.journal_entry_obj = ae_acct.slct.journal_entry_obj;
});
});
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');
let lq__journal_entry_obj = $derived(
liveQuery(async () => {
let results = await db_journals.journal_entry.get(
$journals_slct.journal_entry_id ?? ''
); // null or undefined does not reset things like '' does
// Check if results are different than the current session version stored under $journals_slct
// Check if results are different than the current session version stored under $journals_slct
if ($journals_slct.journal_entry_obj && results) {
if (
$journals_slct.journal_obj_li &&
JSON.stringify($journals_slct.journal_obj_li) !==
JSON.stringify(results)
JSON.stringify($journals_slct.journal_entry_obj) !==
JSON.stringify(results)
) {
$journals_slct.journal_obj_li = [...results];
$journals_slct.journal_entry_obj = { ...results };
}
}
return results;
})
);
return results;
})
);
$effect(() => {
if (log_lvl) {
console.log(`lq__journal_obj_li: person_id = ${$ae_loc.person_id}`);
console.log(`lq__journal_obj_li: results = `, lq__journal_obj_li);
$effect(() => {
if (log_lvl) {
console.log(
`lq__journal_entry_obj: journal_entry_id = ${$journals_slct?.journal_entry_id}`
);
console.log(`lq__journal_entry_obj: results = `, lq__journal_entry_obj);
if ($journals_slct.journal_entry_obj && lq__journal_entry_obj) {
if (
$journals_slct.journal_obj_li &&
JSON.stringify($journals_slct.journal_obj_li) !==
JSON.stringify(lq__journal_obj_li)
JSON.stringify($journals_slct.journal_entry_obj) !==
JSON.stringify(lq__journal_entry_obj)
) {
console.log(
`Session slct li stored version has changed for ID = ${$ae_loc.person_id}`,
$journals_slct.journal_obj_li
`Session slct stored version has changed for ID = ${$journals_slct.journal_entry_id}`,
$journals_slct.journal_entry_obj
);
} else {
if (log_lvl > 1) {
console.log(
`Session slct li stored version has not changed for ID = ${$ae_loc.person_id}`
);
}
}
}
});
// 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
// NOTE: This must remain reactive (in an effect) so it updates on same-route navigation.
$effect(() => {
if (!ae_acct) return;
untrack(() => {
$journals_slct.journal_entry_id = ae_acct.slct.journal_entry_id;
// $journals_slct.journal_entry_obj = ae_acct.slct.journal_entry_obj;
});
});
let lq__journal_entry_obj = $derived(
liveQuery(async () => {
let results = await db_journals.journal_entry.get(
$journals_slct.journal_entry_id ?? ''
); // null or undefined does not reset things like '' does
// Check if results are different than the current session version stored under $journals_slct
if ($journals_slct.journal_entry_obj && results) {
if (
JSON.stringify($journals_slct.journal_entry_obj) !==
JSON.stringify(results)
) {
$journals_slct.journal_entry_obj = { ...results };
}
}
return results;
})
);
$effect(() => {
if (log_lvl) {
console.log(
`lq__journal_entry_obj: journal_entry_id = ${$journals_slct?.journal_entry_id}`
);
console.log(
`lq__journal_entry_obj: results = `,
lq__journal_entry_obj
);
if ($journals_slct.journal_entry_obj && lq__journal_entry_obj) {
if (
JSON.stringify($journals_slct.journal_entry_obj) !==
JSON.stringify(lq__journal_entry_obj)
) {
console.log(
`Session slct stored version has changed for ID = ${$journals_slct.journal_entry_id}`,
$journals_slct.journal_entry_obj
);
} else {
console.log(
`Session slct stored version has not changed for ID = ${$journals_slct.journal_entry_id}`
);
}
}
}
});
$effect(() => {
if (browser && $lq__journal_entry_obj?.journal_entry_id) {
// Start with the current KV or convert the LI to a KV if needed
let history_kv = {
...($journals_loc?.entry_view_history_kv ?? {})
};
// 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}`
};
console.log(`history_kv (before limiting) = `, history_kv);
// // Convert KV to array, sort by most recent (last updated), and limit to 15
// let history_li = Object.values(history_kv);
// console.log(`history_li (before limiting) = `, 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];
// }
// }
// 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
`Session slct stored version has not changed for ID = ${$journals_slct.journal_entry_id}`
);
} else {
if (log_lvl > 1) {
console.log(
`$journals_loc.entry_view_history_kv has not changed.`
);
}
}
// log_lvl = 1;
}
});
}
});
$effect(() => {
if (browser && $lq__journal_entry_obj?.journal_entry_id) {
// Start with the current KV or convert the LI to a KV if needed
let history_kv = {
...($journals_loc?.entry_view_history_kv ?? {})
};
// 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}`
};
console.log(`history_kv (before limiting) = `, history_kv);
// // Convert KV to array, sort by most recent (last updated), and limit to 15
// let history_li = Object.values(history_kv);
// console.log(`history_li (before limiting) = `, 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];
// }
// }
// 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.`
);
}
}
// log_lvl = 1;
}
});
</script>
<!-- <svelte:head>
@@ -274,22 +266,20 @@
class="
ae_journals__journal_entry
mx-auto
flex flex-col grow gap-1
items-center
min-h-full
max-h-max
flex max-h-max min-h-full max-w-max
min-w-full
max-w-max
grow
flex-col
items-center
gap-1
space-y-2
"
>
">
<!-- {#if $lq__journal_entry_obj} -->
<Journal_entry_view
{lq__journal_obj}
{lq__journal_obj_li}
{lq__journal_entry_obj}
on_show_export={() => (show_export_modal = true)}
/>
on_show_export={() => (show_export_modal = true)} />
<!-- {/if} -->
</section>
@@ -297,12 +287,10 @@
bind:open={show_export_modal}
entries={$lq__journal_entry_obj ? [$lq__journal_entry_obj] : []}
journal={$lq__journal_obj}
on_close={() => (show_export_modal = false)}
/>
on_close={() => (show_export_modal = false)} />
{:else}
<section
class="main_content grow px-1 md:px-2 pb-28 flex flex-col gap-1 items-center"
>
class="main_content flex grow flex-col items-center gap-1 px-1 pb-28 md:px-2">
<p class="text-center">
You must be logged in as the owner to view this Journal Entry.
</p>