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

Work on making the Entry search query work correctly. Moved things around. Hopefully easier to read and understand.

Browse Source
This commit is contained in:
Scott Idem
2025-08-21 18:00:32 -04:00
parent 33c6cb862e
commit 6d2c3cb056
5 changed files with 1566 additions and 1389 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

File diff suppressed because it is too large Load Diff

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

@@ -2,14 +2,38 @@
/** @type {import('./$types').PageData} */
let log_lvl: number = $state(1);
interface Props {
data: any;
}
let { data }: Props = $props();
// *** Import Svelte specific
import { browser } from '$app/environment';
// import { goto } from '$app/navigation';
// *** Import other supporting libraries
// import {
// ArrowDown01, ArrowDown10, ArrowDownUp,
// BetweenVerticalEnd, BetweenVerticalStart,
// BookHeart, BookImage, Bookmark, BookOpenText, BriefcaseBusiness,
// Check, Copy,
// Expand, Eye, EyeOff,
// Flag, FlagOff, FilePlus, Fingerprint,
// Globe,
// Library,
// MessageSquareWarning, Minus,
// Notebook,
// Pencil, Plus,
// RemoveFormatting,
// SquareLibrary,
// Shapes, Share2, ShieldCheck, ShieldMinus, Siren, Skull,
// Tags, Target, ToggleLeft, ToggleRight, Trash2, TypeOutline,
// X
// } from '@lucide/svelte';
// import * as icons from '@lucide/svelte';
import { BookHeart, FilePlus } from '@lucide/svelte';
import { Modal } from 'flowbite-svelte';
// import { Modal } from 'flowbite-svelte';
import { liveQuery } from "dexie";
// *** Import Aether specific variables and functions
@@ -27,13 +51,9 @@ import Journal_view from './../ae_comp__journal_obj_id_view.svelte';
// import Element_data_store from '$lib/element_data_store_v2.svelte';
import Journal_entry_obj_li from './../ae_comp__journal_entry_obj_li.svelte';
// import Journal_entry_obj_id_edit from './ae_journals_comp__journal_entry_obj_id_edit.svelte';
// import Journal_entry_obj_qry from './../ae_comp__journal_entry_obj_qry.svelte';
import Journal_obj_id_edit from '../ae_comp__journal_obj_id_edit.svelte';
interface Props {
data: any;
}
let { data }: Props = $props();
// let ae_promises: key_val = {};
// let ae_tmp: key_val = {};
@@ -59,9 +79,12 @@ $inspect($journals_slct.journal_entry_id, `$journals_slct.journal_entry_id = ${$
// });
// For some reason data.params.journal_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_id = ae_acct.slct.journal_id;
// $journals_slct.journal_id = ae_acct.slct.journal_id;
// $journals_slct.journal_obj = ae_acct.slct.journal_obj;
$journals_slct.journal_id = ae_acct.slct.journal_id;
$journals_sess.entry_li = [];
$journals_slct.journal_entry_id = null;
let lq__journal_obj = $derived(liveQuery(async () => {
@@ -74,6 +97,7 @@ let lq__journal_obj = $derived(liveQuery(async () => {
if (log_lvl) {
console.log(`lq__journal_obj: results = `, results);
}
// tmp_journal_obj = { ...results };
// Check if results are different than the current session version stored under $journals_slct
if ($journals_slct.journal_obj && results) {
@@ -95,9 +119,10 @@ let lq__journal_obj = $derived(liveQuery(async () => {
let lq__journal_entry_obj_li = $derived(liveQuery(async () => {
log_lvl = 1;
if (log_lvl) {
console.log(`$lq__journal_obj.cfg_json = `, $lq__journal_obj?.cfg_json);
console.log(`$journals_loc.filter__category_code = `, $journals_loc.filter__category_code);
console.log(`LQ - $lq__journal_obj.cfg_json = `, $lq__journal_obj?.cfg_json);
console.log(`LQ - $journals_loc.filter__category_code = `, $journals_loc.filter__category_code);
}
if ($journals_sess.entry_li_trigger && !$journals_sess?.entry_li) {
@@ -108,6 +133,9 @@ let lq__journal_entry_obj_li = $derived(liveQuery(async () => {
let results;
if ($journals_sess?.entry_li && $journals_sess?.entry_li?.length) {
if (log_lvl) {
console.log(`LQ - Using $journals_sess.entry_li to get journal entries.`);
}
// $journals_sess.entry_li_trigger = false;
let journal_entry_id_random_li = []; // This is to prevent the array from constantly updating and triggering the liveQuery.
@@ -122,6 +150,9 @@ let lq__journal_entry_obj_li = $derived(liveQuery(async () => {
.bulkGet(journal_entry_id_random_li);
} else if ($lq__journal_obj?.cfg_json?.entry_group_sort === 'DESC') {
if (log_lvl) {
console.log(`LQ - Using DESC sort for Journal Entry list journal_id: ${$journals_slct?.journal_id}`);
}
results = await db_journals.journal_entry
// .orderBy('updated_on')
.where('journal_id')
@@ -133,8 +164,7 @@ let lq__journal_entry_obj_li = $derived(liveQuery(async () => {
} else if ($journals_loc.filter__category_code && $journals_loc.filter__category_code.length > 0) {
if (log_lvl) {
// console.log(`$lq__journal_obj.cfg_json = `, $lq__journal_obj?.cfg_json);
console.log(`$journals_loc.filter__category_code = `, $journals_loc.filter__category_code);
console.log(`LQ - Using category filter: ${$journals_loc.filter__category_code}`);
}
results = await db_journals.journal_entry
.where('journal_id')
@@ -146,7 +176,7 @@ let lq__journal_entry_obj_li = $derived(liveQuery(async () => {
} else {
if (log_lvl) {
// console.log(`$lq__journal_obj.cfg_json = `, $lq__journal_obj?.cfg_json);
console.log(`$journals_slct?.journal_id - default query using journal_id: ${$journals_slct?.journal_id}`);
console.log(`LQ - Using default sort for Journal Entry list journal_id: ${$journals_slct?.journal_id}`);
}
results = await db_journals.journal_entry
.where('journal_id')
@@ -174,6 +204,8 @@ let lq__journal_entry_obj_li = $derived(liveQuery(async () => {
}));
// Trigger doing a basic load of journal entries
// NOTE: Categories are (currently) filtered at the CSS style level.
$effect(() => {
if ($journals_trig.journal_entry_li) {
$journals_trig.journal_entry_li = false;
@@ -211,9 +243,15 @@ if ($journals_trig.journal_entry_li) {
try_cache: true,
log_lvl: log_lvl,
});
// Should we reset the entry list???
// $journals_sess.entry_li = null;
}
});
if (browser) {
let message = {'journal_id': $journals_slct?.journal_id ?? null};
window.parent.postMessage(message, "*");
@@ -245,6 +283,11 @@ if (browser) {
"
> -->
<Journal_view
lq__journal_obj={lq__journal_obj}
lq__journal_entry_obj_li={lq__journal_entry_obj_li}
@@ -266,48 +309,13 @@ if (browser) {
<!-- Modal: Journal edit ID -->
<Modal
title="{$lq__journal_obj?.name} - {$lq__journal_obj?.id}"
bind:open={$journals_sess.show__modal_edit__journal_obj}
autoclose={false}
placement="top-center"
size="xl"
class="top-center bg-white dark:bg-gray-800 text-gray-800 dark:text-gray-200 rounded-lg border-gray-200 dark:border-gray-700 divide-gray-200 dark:divide-gray-700 shadow-md relative flex flex-col mx-auto w-full divide-y"
>
<!-- tmp__journal_obj={$journals_slct.journal_obj} -->
<Journal_obj_id_edit
log_lvl={log_lvl}
lq__journal_obj={lq__journal_obj}
{#snippet header()}
<div class="flex flex-row items-center justify-between w-full">
<h3 class="text-lg font-semibold">
{#if $ae_loc.trusted_access}
<!-- <div class="ae_options"> -->
<button
type="button"
onclick={() => {
$journals_sess.show__modal_view__journal_id = $journals_slct.journal_id;
$journals_sess.show__modal_edit__journal_obj = false;
}}
class="novi_btn btn btn-sm preset-tonal-warning border border-warning-500 hover:preset-filled-warning-500 transition"
title={`View journal: ${$lq__journal_obj?.name}`}
>
<span class="fas fa-eye m-1"></span> View
</button>
<!-- </div> -->
{/if}
<span class="text-sm text-gray-500">
Edit Journal:
</span>
{$lq__journal_obj?.name}
</h3>
</div>
{/snippet}
NO LONGER USED
</Modal>
show={$journals_sess.show__modal_edit__journal_obj}
/>
{:else}
<section class="main_content grow px-1 md:px-2 pb-28 flex flex-col gap-1 items-center">

98
src/routes/journals/ae_comp__journal_entry_obj_li.svelte
View File

@@ -1,5 +1,15 @@
<script lang="ts">
let log_lvl: number = 0;
interface Props {
log_lvl?: number;
lq__journal_obj: any;
lq__journal_entry_obj_li: any;
}
let {
log_lvl = $bindable(0),
lq__journal_obj,
lq__journal_entry_obj_li
}: Props = $props();
// *** Import Svelte specific
import { goto, invalidate, pushState, replaceState } from '$app/navigation';
@@ -26,12 +36,6 @@ import { ae_snip, ae_loc, ae_sess, ae_api, ae_trig, slct, slct_trigger } from '$
import { journals_loc, journals_sess, journals_slct, journals_trig } from '$lib/ae_journals/ae_journals_stores';
import { journals_func } from '$lib/ae_journals/ae_journals_functions';
interface Props {
lq__journal_obj: any;
lq__journal_entry_obj_li: any;
}
let { lq__journal_obj, lq__journal_entry_obj_li }: Props = $props();
let ae_promises: key_val = $state({});
// let ae_tmp: key_val = {};
@@ -53,52 +57,6 @@ $effect(() => {
}
});
// async function update_journal_entry(journal_entry_id) {
// if (!$ae_loc.trusted_access) {
// alert('You do not have permission to update this journal entry.');
// return;
// }
// let data_kv = {
// alert: tmp_entry_obj?.alert,
// personal: tmp_entry_obj?.personal,
// private: tmp_entry_obj?.private,
// professional: tmp_entry_obj?.professional,
// public: tmp_entry_obj?.public,
// template: tmp_entry_obj?.template,
// hide: tmp_entry_obj?.hide,
// priority: tmp_entry_obj?.priority,
// enable: tmp_entry_obj?.enable,
// // alert_msg: $lq__journal_entry_obj?.alert_msg ? false : true
// alert_msg: tmp_entry_obj?.alert_msg,
// category_code: tmp_entry_obj?.category_code,
// content: tmp_entry_obj?.content,
// group: tmp_entry_obj?.group,
// name: tmp_entry_obj?.name,
// tags: tmp_entry_obj?.tags,
// };
// // Call API to save the content
// try {
// await journals_func.update_ae_obj__journal_entry({
// api_cfg: $ae_api,
// journal_entry_id: 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.');
// }
// }
</script>
@@ -117,7 +75,7 @@ $effect(() => {
<div
class="
container journal journal_entry_obj
border border
border
px-2 py-1 space-y-1
w-full max-w-(--breakpoint-lg)
flex flex-col items-center justify-center
@@ -407,9 +365,9 @@ $effect(() => {
{/if}
<a
href="/journals/{journals_journal_entry_obj?.journal_id}/entry/{journals_journal_entry_obj?.journal_entry_id}"
href="/journals/{journals_journal_entry_obj?.journal_id ?? $lq__journal_obj?.journal_id}/entry/{journals_journal_entry_obj?.journal_entry_id}"
class="btn preset-tonal-primary border border-primary-500 hover:preset-filled-primary-500 transition"
title={`View ID: ${journals_journal_entry_obj?.id}\n${journals_journal_entry_obj?.name ?? ae_util.iso_datetime_formatter(journals_journal_entry_obj.created_on, 'datetime_iso_12_no_seconds')}`}
title={`View ID: ${journals_journal_entry_obj?.id}\n${journals_journal_entry_obj?.name ?? ae_util.iso_datetime_formatter(journals_journal_entry_obj.created_on, 'datetime_iso_12_no_seconds')}\nJournal ID: ${journals_journal_entry_obj?.journal_id}\n`}
>
<NotebookPen class="mx-1 inline-block"/>
<span class="hidden md:inline">
@@ -478,34 +436,6 @@ $effect(() => {
</article>
{/if}
<!-- <div class="ae_options flex flex-row flex-wrap gap-2 items-center justify-center"> -->
<!-- <a
href="/journals/{journals_journal_entry_obj?.journal_id}/entry/{journals_journal_entry_obj?.journal_entry_id}"
class="btn btn-secondary btn-md variant-ghost-primary hover:variant-filled-primary transition"
title={`View: ${journals_journal_entry_obj?.name}`}
>
<NotebookText class="m-1"/> View
</a> -->
<!-- {#if $ae_loc.trusted_access && $ae_loc.edit_mode}
<button
type="button"
disabled={!$ae_loc.trusted_access}
onclick={() => {
$journals_slct.journal_entry_id = journals_journal_entry_obj.journal_entry_id;
$journals_slct.journal_entry_obj = journals_journal_entry_obj;
$journals_sess.show__modal_view__journal_entry_id = false;
$journals_sess.show__modal_edit__journal_entry_id = $journals_slct.journal_entry_id;
}}
class="novi_btn btn btn-sm variant-glass-warning hover:variant-filled-warning transition"
title={`Edit journal entry: ${journals_journal_entry_obj?.name}`}
>
<span class="fas fa-edit m-1"></span> Edit
</button>
{/if} -->
<!-- </div> -->
<section
class:hidden={!journals_journal_entry_obj?.original_datetime && !journals_journal_entry_obj?.original_timezone}

201
src/routes/journals/ae_comp__journal_entry_obj_qry.svelte Normal file
View File

@@ -0,0 +1,201 @@
<script lang="ts">
interface Props {
log_lvl?: number;
lq__journal_obj: any;
}
let {
log_lvl = $bindable(0),
lq__journal_obj,
}: Props = $props();
import {
ArrowDown01, ArrowDown10, ArrowDownUp,
BetweenVerticalEnd, BetweenVerticalStart,
BookHeart, BookImage, Bookmark, BookOpenText, BriefcaseBusiness,
Check, Copy,
Expand, Eye, EyeOff,
Flag, FlagOff, FilePlus, Fingerprint,
Globe,
Library,
MessageSquareWarning, Minus,
Notebook,
Pencil, Plus,
RemoveFormatting,
SquareLibrary,
Shapes, Share2, ShieldCheck, ShieldMinus, Siren, Skull,
Tags, Target, ToggleLeft, ToggleRight, Trash2, TypeOutline,
X
} from '@lucide/svelte';
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_prom, journals_trig } from '$lib/ae_journals/ae_journals_stores';
import { journals_func } from '$lib/ae_journals/ae_journals_functions';
// Trigger doing a search query for journal entries
$effect(async () => {
if ($journals_trig.journal_entry_qry) {
$journals_trig.journal_entry_qry = false;
if (log_lvl) {
console.log(`Triggered: $journals_trig.journal_entry_qry: ${$journals_loc.qry__search_text}`);
}
// $journals_prom.load__journal_entry_obj_qry = journals_func.qry__journal_entry({
$journals_prom.load__journal_entry_obj_li = await journals_func.qry__journal_entry({
api_cfg: $ae_api,
journal_id: $lq__journal_obj?.journal_id ?? '',
qry_str: $journals_loc.qry__search_text,
// qry_created_on: null,
// qry_alert: null,
// qry_priority: null,
// qry_type: and_type,
// enabled: $journals_loc.recovery_meetings.qry__enabled,
// hidden: $journals_loc.recovery_meetings.qry__hidden,
// order_by_li: $journals_loc.recovery_meetings.qry__order_by_li,
// limit: $journals_loc.recovery_meetings.qry__limit,
// try_cache: try_cache,
log_lvl: log_lvl,
});
if ($journals_prom.load__journal_entry_obj_li.length) {
$journals_sess.entry_li = $journals_prom.load__journal_entry_obj_li;
$journals_sess = {
...$journals_sess }; // ensure session is updated
// $journals_trig.journal_entry_li = true; // trigger the entry list to refresh
// $journals_trig.journal_entry_li = $journals_prom.load__journal_entry_obj_li;
} else {
console.log('Clear the search results: no entries found for that query.');
// $journals_sess.entry_li = [''];
$journals_sess.entry_li = null;
// $journals_trig.journal_entry_li = true;
// alert('No journal entries found for that search query.');
// $journals_sess = $journals_sess;
}
if (log_lvl) {
console.log(`$journals_sess.entry_li = `, $journals_sess.entry_li);
}
}
});
</script>
<!-- Search input form -->
<span class="flex flex-row items-center gap-2">
<span class="text-sm text-gray-500 hidden lg:inline">
Search:
</span>
<input
disabled={false}
type="text"
placeholder="Search Journal Entries"
bind:value={$journals_loc.qry__search_text}
onkeyup={(event) => {
if (event.key === 'Enter') {
log_lvl = 1;
$journals_trig.journal_entry_qry = true;
// $journals_loc.qry__search_text = event.target.value;
// $journals_trig.journal_entry_li = true;
// console.log('Search query:', $journals_loc.qry__search_text);
// $journals_prom.load__journal_entry_obj_qry = await journals_func.qry__journal_entry({
// api_cfg: $ae_api,
// journal_id: $lq__journal_obj?.journal_id ?? '',
// qry_str: $journals_loc.qry__search_text,
// // qry_created_on: null,
// // qry_alert: null,
// // qry_priority: null,
// // qry_type: and_type,
// // enabled: $journals_loc.recovery_meetings.qry__enabled,
// // hidden: $journals_loc.recovery_meetings.qry__hidden,
// // order_by_li: $journals_loc.recovery_meetings.qry__order_by_li,
// // limit: $journals_loc.recovery_meetings.qry__limit,
// // try_cache: try_cache,
// log_lvl: log_lvl,
// });
// if ($journals_prom.load__journal_entry_obj_qry.length) {
// $journals_sess.entry_li = $journals_prom.load__journal_entry_obj_qry;
// $journals_sess = {
// ...$journals_sess }; // ensure session is updated
// // $journals_trig.journal_entry_li = true; // trigger the entry list to refresh
// // $journals_trig.journal_entry_li = $journals_prom.load__journal_entry_obj_qry;
// } else {
// console.log('Clear the search results: no entries found for that query.');
// // $journals_sess.entry_li = [''];
// $journals_sess.entry_li = null;
// // $journals_trig.journal_entry_li = true;
// // alert('No journal entries found for that search query.');
// // $journals_sess = $journals_sess;
// }
}
}}
title="Search Journal Entries"
class="input input-sm input-bordered w-44 text-sm md:w-52"
class:bg-red-200={$journals_sess.entry_li == null}
class:dark:bg-red-800={$journals_sess.entry_li == null}
/>
<!-- Clear search text button -->
<button
disabled={true}
type="button"
class:hidden={!$journals_loc.qry__search_text}
onclick={() => {
// $journals_loc.qry__search_text = '';
// $journals_trig.journal_entry_li = true;
// console.log('Cleared search query:', $journals_loc.qry__search_text);
}}
class="btn btn-sm p-1.5 text-sm text-gray-500 preset-tonal-tertiary border border-tertiary-500 hover:preset-filled-tertiary-500 transition"
title="Clear search text"
>
<!-- <X /> -->
<RemoveFormatting strokeWidth="1" color="gray" size="1.25em" />
<span class="hidden md:inline text-gray-500">
Clear
</span>
</button>
</span>
<!-- Give list of categories to base the new entry on -->
<span class="flex flex-row items-center gap-2">
<span class="text-sm text-gray-500 hidden md:inline">
Category:
</span>
<select
class="btn btn-secondary btn-sm
preset-tonal-primary
hover:preset-filled-primary-500
transition
text-xs
"
bind:value={$journals_loc.qry__category_code}
onchange={(event) => {
// WARNING: This will cause pages to reset if the journal entry list is being filtered by category. This is a bug that should be fixed.
$journals_loc.qry__category_code = event.target.value;
$journals_loc.filter__category_code = event.target.value;
$journals_trig.journal_entry_li = true;
console.log('Selected category:', $journals_loc.qry__category_code);
}}
title="Select a category for the new journal entry"
>
<option value="">Select Category</option>
{#each $lq__journal_obj?.cfg_json?.category_li as category}
<option value={category.code}>{category.name}</option>
{/each}
</select>
</span>

1197
src/routes/journals/ae_comp__journal_obj_id_edit.svelte Normal file
View File

File diff suppressed because it is too large Load Diff