Work on the new Journals. Just saving things while they are working well.

package-lock.json

@@ -9,6 +9,7 @@
       "version": "0.2.4",
       "dependencies": {
         "@floating-ui/dom": "^1.6.0",
+        "@lucide/svelte": "^0.483.0",
         "@popperjs/core": "^2.11.0",
         "@tiptap/extension-bullet-list": "^2.10.2",
         "@tiptap/extension-document": "^2.10.2",
@@ -67,7 +68,6 @@
         "flowbite": "^3.0.0",
         "highlight.js": "^11.10.0",
         "lowlight": "^3.2.0",
-        "lucide-svelte": "^0",
         "mode-watcher": "^0.5.0",
         "postcss": "^8.4.41",
         "prettier": "^3.1.1",
@@ -889,6 +889,15 @@
         "@jridgewell/sourcemap-codec": "^1.4.14"
       }
     },
+    "node_modules/@lucide/svelte": {
+      "version": "0.483.0",
+      "resolved": "https://registry.npmjs.org/@lucide/svelte/-/svelte-0.483.0.tgz",
+      "integrity": "sha512-b3SbhMIgVJAj/rPa3go6uplTzaFkJzz91TSPO8I8gc2evtHOA2OgSmPYz0S+yEKFIWqLUZ4gika19ljV+tnmyQ==",
+      "license": "ISC",
+      "peerDependencies": {
+        "svelte": "^5"
+      }
+    },
     "node_modules/@nodelib/fs.scandir": {
       "version": "2.1.5",
       "resolved": "https://registry.npmjs.org/@nodelib/fs.scandir/-/fs.scandir-2.1.5.tgz",
@@ -4668,16 +4677,6 @@
       "dev": true,
       "license": "ISC"
     },
-    "node_modules/lucide-svelte": {
-      "version": "0.477.0",
-      "resolved": "https://registry.npmjs.org/lucide-svelte/-/lucide-svelte-0.477.0.tgz",
-      "integrity": "sha512-w/zj6/CXTtTizIeo8SuWGYu0u45CJ7cD2AtNzIObVHZrWXNgaIIX/2cI25wybjSmYHIi4pub2TLv/kNPKiB3ww==",
-      "dev": true,
-      "license": "ISC",
-      "peerDependencies": {
-        "svelte": "^3 || ^4 || ^5.0.0-next.42"
-      }
-    },
     "node_modules/magic-string": {
       "version": "0.30.17",
       "resolved": "https://registry.npmjs.org/magic-string/-/magic-string-0.30.17.tgz",

package.json

@@ -62,7 +62,6 @@
     "flowbite": "^3.0.0",
     "highlight.js": "^11.10.0",
     "lowlight": "^3.2.0",
-    "lucide-svelte": "^0",
     "mode-watcher": "^0.5.0",
     "postcss": "^8.4.41",
     "prettier": "^3.1.1",
@@ -88,6 +87,7 @@
   "type": "module",
   "dependencies": {
     "@floating-ui/dom": "^1.6.0",
+    "@lucide/svelte": "^0.483.0",
     "@popperjs/core": "^2.11.0",
     "@tiptap/extension-bullet-list": "^2.10.2",
     "@tiptap/extension-document": "^2.10.2",

src/lib/ae_journals/ae_journals__journal_entry.ts

@@ -165,6 +165,11 @@ export async function create_ae_obj__journal_entry(
         console.log(`*** create_ae_obj__journal_entry() *** journal_id=${journal_id}`);
     }
 
+    if (!journal_id) {
+        console.log(`ERROR: Journals - Entry - journal_id required to create`);
+        return false;
+    }
+
     ae_promises.create__journal_entry = await api.create_ae_obj_crud({
         api_cfg: api_cfg,
         obj_type: 'journal_entry',
@@ -348,9 +353,10 @@ export async function db_save_ae_obj_li__journal_entry(
 
                     person_id: obj.person_id_random,
 
-                    activity: obj.activity,
+                    activity_code: obj.activity_code,
-                    category: obj.category,
+                    category_code: obj.category_code,
-                    topic: obj.topic,
+                    type_code: obj.type_code,
+                    topic_code: obj.topic_code,
 
                     public: obj.public,
                     private: obj.private,

src/lib/ae_journals/ae_journals_stores.ts

@@ -7,7 +7,7 @@ import type { key_val } from '$lib/ae_stores';
 
 /* *** BEGIN *** Initialize journals_local_data_struct */
 // This is for longer term or sticky app data. This should be stored to *local* storage.
-// Updated 2024-08-20
+// Updated 2025-03-20
 let journals_local_data_struct: key_val = {
     ver: '2024-08-20_19',
     // Shared
@@ -27,6 +27,15 @@ let journals_local_data_struct: key_val = {
     qry__offset: 0,
     qry__journal_id: null,
 
+    journal: {
+        edit: false,
+        edit_kv: {},
+    },
+    entry: {
+        edit: false,
+        edit_kv: {},
+    },
+
 };
 // console.log(`AE Stores - App Journals Local Storage Data:`, journals_local_data_struct);
 
@@ -35,10 +44,9 @@ export let journals_loc: Writable<key_val> = localStorageStore('ae_journals_loc'
 // console.log(`AE Stores - App Local Storage Data:`, get(ae_loc));
 
 
-
 /* *** BEGIN *** Initialize journals_session_data_struct */
 // Temporary app data. This is lost if the page is refreshed or using different tabs/windows. This should be stored to *session* storage.
-// Updated 2024-08-20
+// Updated 2025-03-20
 let journals_session_data_struct: key_val = {
     ver: '2024-08-20_19',
     log_lvl: 1,
@@ -53,6 +61,15 @@ let journals_session_data_struct: key_val = {
     show_list__journal_entry_li_group: true,
     show__modal_view__journal_entry_id: null,
     show__modal_edit__journal_entry_id: null,
+
+    journal: {
+        edit: false,
+        edit_kv: {},
+    },
+    entry: {
+        edit: false,
+        edit_kv: {},
+    },
 };
 // console.log(`AE Stores - App Journals Session Storage Data:`, journals_session_data_struct);
 export let journals_sess = writable(journals_session_data_struct);

src/lib/ae_journals/db_journals.ts

@@ -147,7 +147,11 @@ export interface Journal_Entry {
     for_type?: null|string;
     for_id?: null|string;
 
+    activity_code?: null|string;
+    category_code?: null|string;
+    topic_code?: null|string;
     type_code?: null|string;
+
     journal_entry_type?: null|string; // This is the type of journal entry
 
     account_id?: null|string; // Owner account of the journal
@@ -155,10 +159,6 @@ export interface Journal_Entry {
     // event_id?: null|string; // Assign to an event???
     // location_id?: null|string; // Assign to a location???
 
-    activity?: null|string;
-    category?: null|string;
-    topic?: null|string;
-
     public?: null|boolean;
     private?: null|boolean;
     personal?: null|boolean;
@@ -176,10 +176,23 @@ export interface Journal_Entry {
     start_datetime?: null|Date;
     end_datetime?: null|Date;
     timezone?: null|string;
+    seconds?: null|number; // Duration in seconds
+
+    location?: null|string; // Location of the journal entry
+    latitude?: null|number; // Latitude of the journal entry
+    longitude?: null|number; // Longitude of the journal entry
+
+    billable?: null|boolean; // Is this billable?
+    bill_to?: null|string; // Who to bill for this journal entry
+    bill_rate?: null|number; // Rate to bill for this journal entry
+    billable_minutes?: null|number; // Billable minutes for this journal entry
 
     alert?: null|boolean; // LLM (AI) generated summary...???
     alert_msg?: null|string; // LLM (AI) generated summary...???
 
+    parent_id?: null|string; // This is the parent journal entry ID. If deleted, then delete all children journal entries.
+    related_entry_id_li?: null|key_val; // List of related journal entry IDs
+
     // cfg_json?: null|key_val; // This is the configuration JSON for the journal entry
     data_json?: null|string; // We always need to store something extra...
 

src/routes/journals/+layout.svelte

@@ -134,7 +134,7 @@ if (browser) {
 {/if}
 
 
-<section class="status flex flex-col justify-center items-center gap-1">
+<!-- <section class="status flex flex-col justify-center items-center gap-1">
     {#if $ae_loc.administrator_access}
         <h3 class="h4">Administrator Access - Technical Support</h3>
         <p>You are accessing the journals module with "administrator" level permissions.</p>
@@ -145,7 +145,7 @@ if (browser) {
         <h3 class="h4">Restricted Access</h3>
         <p>You are accessing to the journals module is limited</p>
     {/if}
-</section>
+</section> -->
 
 
 <section class="main_content container">

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

@@ -1,6 +1,6 @@
 <script lang="ts">
 /** @type {import('./$types').PageData} */
-let log_lvl: number = 1;
+let log_lvl: number = 0;
 
 // *** Import Svelte specific
 import { browser } from '$app/environment';
@@ -59,9 +59,12 @@ let lq__journal_obj = $derived(liveQuery(async () => {
     return results;
 }));
 
+let force_refresh = false; // Set to true to force a refresh of the data
 let lq__journal_entry_obj_li = $derived(liveQuery(async () => {
     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(`force_refresh = `, force_refresh);
     }
     if ($lq__journal_obj?.cfg_json?.entry_group_sort === 'DESC') {
         let results = await db_journals.journal_entry
@@ -73,6 +76,26 @@ let lq__journal_entry_obj_li = $derived(liveQuery(async () => {
             .sortBy('updated_on');
             // .sortBy('title');
 
+        return results;
+    // } else if (force_refresh) {
+    //     force_refresh = false;
+    //     console.log(`lq__journal_entry_obj_li - force refresh`);
+    //     let results = await db_journals.journal_entry
+    //         .where('journal_id')
+    //         .equals($journals_slct?.journal_id ?? '') // null or undefined does not reset things like '' does
+    //         // .reverse()
+    //         .sortBy('updated_on');
+
+    //     return results;
+    } else if ($journals_loc.filter__category_code && $journals_loc.filter__category_code.length > 0) {
+        console.log(`lq__journal_entry_obj_li - filtering by category_code: ${$journals_loc.filter__category_code}`);
+        let results = await db_journals.journal_entry
+            .where('journal_id')
+            .equals($journals_slct?.journal_id ?? '') // null or undefined does not reset things like '' does
+            .and(entry => entry.category_code === $journals_loc.filter__category_code)
+            // .reverse()
+            .sortBy('updated_on');
+
         return results;
     } else {
         console.log(`lq__journal_entry_obj_li - default query using journal_id: ${$journals_slct?.journal_id}`);
@@ -105,50 +128,83 @@ let lq__journal_entry_obj_li = $derived(liveQuery(async () => {
 
 
 $effect(() => {
-        if ($journals_trig.journal_entry_li) {
+    if ($journals_trig.journal_entry_li) {
-        $journals_trig.journal_entry_li = false;
+    $journals_trig.journal_entry_li = false;
 
-        if (log_lvl) {
+    if (log_lvl) {
-            console.log(`Triggered: $journals_trig.journal_entry_li`);
+        console.log(`Triggered: $journals_trig.journal_entry_li`);
-        }
+    }
 
-        if ($journals_loc.qry__enabled !== 'all' || $journals_loc.qry__hidden !== 'all') {
+    if ($journals_loc.qry__enabled !== 'all' || $journals_loc.qry__hidden !== 'all') {
-            console.log(`Deleting disabled or hidden journal entry.`);
+        console.log(`Deleting disabled or hidden journal entry.`);
-            // let results = db_journals.journal_entry
-            //     .where('enable')
-            //     .notEqual(true)
-            //     .delete();
-            let results = db_journals.journal_entry
-                .clear();
-            console.log(`Deleted ${results} disabled journal entry.`);
-
-        }
-        // if ($journals_loc.qry__hidden !== 'all') {
-        //     console.log(`Deleting hidden journal entry.`);
-        //     let results = db_journals.journal_entry
-        //         .clear();
-        //     console.log(`Deleted ${results} hidden journal entry.`);
-
-        // }
         // let results = db_journals.journal_entry
         //     .where('enable')
-        //     .equals('false')
+        //     .notEqual(true)
         //     .delete();
-        // console.log(`Deleted ${results} disabled journal entry.`);
+        let results = db_journals.journal_entry
+            .clear();
+        console.log(`Deleted ${results} disabled journal entry.`);
 
-        $journals_prom.load__journal_entry_obj_li = journals_func.load_ae_obj_li__journal_entry({
-            api_cfg: $ae_api,
-            for_obj_type: 'journal',
-            for_obj_id: $journals_slct.journal_id,
-            enabled: $journals_loc.qry__enabled,
-            hidden: $journals_loc.qry__hidden,
-            limit: $journals_loc.qry__limit,
-            order_by_li: $journals_loc.qry__order_by_li,
-            try_cache: true,
-            log_lvl: log_lvl,
-        });
     }
+
+    // if ($journals_loc.qry__hidden !== 'all') {
+    //     console.log(`Deleting hidden journal entry.`);
+    //     let results = db_journals.journal_entry
+    //         .clear();
+    //     console.log(`Deleted ${results} hidden journal entry.`);
+
+    // }
+    // let results = db_journals.journal_entry
+    //     .where('enable')
+    //     .equals('false')
+    //     .delete();
+    // console.log(`Deleted ${results} disabled journal entry.`);
+
+    $journals_prom.load__journal_entry_obj_li = journals_func.load_ae_obj_li__journal_entry({
+        api_cfg: $ae_api,
+        for_obj_type: 'journal',
+        for_obj_id: $journals_slct.journal_id,
+        enabled: $journals_loc.qry__enabled,
+        hidden: $journals_loc.qry__hidden,
+        limit: $journals_loc.qry__limit,
+        order_by_li: $journals_loc.qry__order_by_li,
+        try_cache: true,
+        log_lvl: log_lvl,
     });
+}
+});
+
+// $effect(() => {
+//     if ($journals_loc.filter__category_code) {
+//         console.log(`Filtering journal entry by category_code: ${$journals_loc.filter__category_code}`);
+
+//         $journals_prom.load__journal_entry_obj_li = journals_func.load_ae_obj_li__journal_entry({
+//             api_cfg: $ae_api,
+//             for_obj_type: 'journal',
+//             for_obj_id: $journals_slct.journal_id,
+//             enabled: $journals_loc.qry__enabled,
+//             hidden: $journals_loc.qry__hidden,
+//             limit: $journals_loc.qry__limit,
+//             order_by_li: $journals_loc.qry__order_by_li,
+//             try_cache: true,
+//             log_lvl: log_lvl,
+//         });
+//     } else {
+//         console.log(`No category_code filter applied.`);
+//         // force_refresh = true;
+//         $journals_prom.load__journal_entry_obj_li = journals_func.load_ae_obj_li__journal_entry({
+//             api_cfg: $ae_api,
+//             for_obj_type: 'journal',
+//             for_obj_id: $journals_slct.journal_id,
+//             enabled: $journals_loc.qry__enabled,
+//             hidden: $journals_loc.qry__hidden,
+//             limit: $journals_loc.qry__limit,
+//             order_by_li: $journals_loc.qry__order_by_li,
+//             try_cache: true,
+//             log_lvl: log_lvl,
+//         });
+//     }
+// });
 
 if (browser) {
     console.log('Browser environment detected.');
@@ -157,6 +213,13 @@ if (browser) {
     window.parent.postMessage(message, "*");
 }
 
+let journal_entry_category_li = [
+    { code: 'test', name: 'Test' },
+    { code: 'personal', name: 'Personal' },
+    { code: 'work', name: 'Work' },
+    { code: 'other', name: 'Other' },
+];
+
 </script>
 
 
@@ -183,16 +246,76 @@ if (browser) {
 
 <!-- <h1>Journals {$lq__journal_obj?.name} - {$lq__journal_entry_obj_li?.length}</h1> -->
 
-<a href="/journals" class="novi_btn btn btn-secondary btn-sm
+<div class="flex flex-row items-center justify-between w-full">
-    variant-ghost-tertiary
+    {$journals_loc.filter__category_code}
-    hover:variant-filled-tertiary
-    transition
-    ">
-    <!-- <span class="fas fa-arrow-left m-1"></span> Back to Journals -->
-    <span class="fas fa-arrow-left m-1"></span>
-    View Other Journals
-</a>
 
+    <a href="/journals" class="novi_btn btn btn-secondary btn-sm
+        variant-ghost-tertiary
+        hover:variant-filled-tertiary
+        transition
+        ">
+        <!-- <span class="fas fa-arrow-left m-1"></span> Back to Journals -->
+        <span class="fas fa-arrow-left m-1"></span>
+        View Other Journals
+    </a>
+
+    <!-- Add default journal entry -->
+    <button
+        class="novi_btn btn btn-secondary btn-sm
+        variant-ghost-success
+        hover:variant-filled-success
+        transition"
+        onclick={() => {
+            // $journals_sess.show__modal_new__journal_entry_obj = true;
+
+            let data_kv = {
+                // journal_id_random: $lq__journal_obj?.journal_id,
+                category_code: 'test',
+            };
+            if ($journals_loc.qry__category_code) {
+                data_kv.category_code = $journals_loc.qry__category_code;
+            }
+            if (log_lvl) {
+                console.log('Creating new journal entry with data_kv:', data_kv);
+            }
+            journals_func.create_ae_obj__journal_entry({
+                api_cfg: $ae_api,
+                journal_id: $lq__journal_obj?.journal_id,
+                data_kv: data_kv,
+                log_lvl: log_lvl
+            }).then((results) => {
+                console.log('New journal entry created:', results);
+                $journals_slct.journal_entry_id = results?.journal_entry_id_random;
+                // alert('Journal entry created successfully!');
+            }).catch((error) => {
+                console.error('Error updating journal entry:', error);
+                alert('Failed to update journal entry.');
+            });
+        }}
+        >
+        <span class="fas fa-plus m-1"></span> New Journal Entry
+    </button>
+
+    <!-- Give list of categories to base the new entry on -->
+    <select
+        class="novi_btn btn btn-secondary btn-sm
+        variant-ghost-primary
+        hover:variant-filled-primary
+        transition"
+        bind:value={$journals_loc.qry__category_code}
+        onchange={(event) => {
+            $journals_loc.qry__category_code = event.target.value;
+            console.log('Selected category:', $journals_loc.qry__category_code);
+        }}
+        >
+        <option value="">Select Category</option>
+        {#each journal_entry_category_li as category}
+            <option value={category.code}>{category.name}</option>
+        {/each}
+    </select>
+
+
+</div>
 
 <Journal_view
     lq__journal_obj={lq__journal_obj}
@@ -228,6 +351,7 @@ if (browser) {
                 {#if $ae_loc.trusted_access}
                 <!-- <div class="ae_options"> -->
                     <button
+                        type="button"
                         onclick={() => {
                         // const url = new URL(location);
                         // url.searchParams.set('event_id', $lq__journal_obj?.event_id_random);
@@ -278,10 +402,10 @@ if (browser) {
 </Modal>
 
 
-<!-- Modal: Journal Content edit ID -->
+<!-- Modal: Journal Entry new -->
-<!-- <Modal
+<Modal
-    bind:open={$journals_sess.show__modal_edit__journal_entry_id}
+    bind:open={$journals_sess.show__modal_new__journal_entry_obj}
-    title="{$lq__journal_entry_obj?.name ?? 'New Journal Content'} - {$lq__journal_entry_obj?.id ?? 'Not Saved Yet'}"
+    title="New Journal Entry - {$lq__journal_obj?.name}"
     autoclose={false}
     placement="top-center"
     size="xl"
@@ -292,36 +416,31 @@ if (browser) {
 
             <div class="flex flex-row items-center justify-between w-full">
                 <h3 class="text-lg font-semibold">
-                    {#if $ae_loc.trusted_access}
+                    <button
-
+                        type="button"
-                        <button
+                        onclick={() => {
-                            onclick={() => {
+                            // Cancel the new journal entry
-                            // const url = new URL(location);
+                            $journals_sess.show__modal_new__journal_entry_obj = false;
-                            // url.searchParams.set('event_id', $lq__journal_entry_obj?.event_id_random);
+                            $journals_slct.journal_entry_id = null;
-                            // history.pushState({}, '', url);
+                            $journals_slct.journal_entry_obj = null;
-
-                            $journals_sess.show__modal_view__journal_entry_id = $journals_slct.journal_entry_id;
-                            $journals_sess.show__modal_edit__journal_entry_id = false;
                         }}
-                            class="novi_btn btn btn-sm variant-ghost-warning hover:variant-filled-warning transition"
+                        class="novi_btn btn btn-sm variant-ghost-warning hover:variant-filled-warning transition"
-                            title={`View meeting: ${$lq__journal_entry_obj?.name}`}
+                        title={`Cancel new journal entry`}
-                            >
+                        >
-                            <span class="fas fa-eye m-1"></span> View
+                        <span class="fas fa-times m-1"></span> Cancel
-                        </button>
+                    </button>
-                    {/if}
+                    New Journal Entry
-
                     <span class="text-sm text-gray-500">
-                        Edit Journal Content:
+                        {$lq__journal_obj?.name}
                     </span>
-                    {$lq__journal_entry_obj?.name ?? 'New Journal Content'}
                 </h3>
             </div>
 
-
     {/snippet}
 
 
-</Modal> -->
+
+</Modal>
 
 
 <!-- Modal: Journal Content ID media player -->

src/routes/journals/ae_comp__journal_entry_obj_id_view.svelte

@@ -1,11 +1,16 @@
 <script lang="ts">
 // *** Import Svelte specific
+// import { createIcons, icons } from 'lucide';
+// createIcons({ icons });
+
+import { BookHeart, BriefcaseBusiness, Fingerprint, Globe, MessageSquareWarning, Share2, Siren, Skull } from '@lucide/svelte';
 
 // *** Import Aether specific variables and functions
+import type { key_val } from '$lib/ae_stores';
 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 { journals_func } from '$lib/ae_journals/ae_journals_functions';
 
 interface Props {
     log_lvl?: number;
@@ -14,18 +19,37 @@ interface Props {
 
 let { log_lvl = 0, lq__journal_entry_obj }: Props = $props();
 
-// let ae_promises: key_val = {};
+let ae_promises: key_val = $state({});
 // let ae_tmp: key_val = {};
 // let ae_trigger: any = null;
 // let ae_triggers: key_val = {};
 
+// let tmp_entry_obj = $lq__journal_entry_obj;
+let tmp_entry_obj: key_val = $state({});
+
+// let tmp_entry_obj = $derived(async () => {
+//         [$lq__journal_entry_obj],
+//         ([$lq__journal_entry_obj]) => {
+//             return $lq__journal_entry_obj;
+//         }
+//     }
+// );
+
+
+$effect(() => {
+    if ($lq__journal_entry_obj) {
+        tmp_entry_obj = { ...$lq__journal_entry_obj };
+    }
+});
+
 // Reminder: Styling is being done with Tailwind CSS, not Bootstrap.
 </script>
 
 
-<section class="svelte_component ae_section ae_view journal_entry_obj view__journal_entry_obj bg-white rounded-lg p-2 m-2" bind:clientHeight={$ae_loc.iframe_height_modal_body}>
+<section class="svelte_component ae_section ae_view journal_entry_obj view__journal_entry_obj bg-white rounded-lg w-full p-2 m-2" bind:clientHeight={$ae_loc.iframe_height_modal_body}>
 
-<header class="ae_header journal_entry__header">
+{#if $lq__journal_entry_obj}
+<header class="ae_header journal_entry__header flex flex-col items-center justify-center">
     <h2 class="journal_entry__name h3">
         {@html $lq__journal_entry_obj?.name ?? 'Loading...'}
         {#await $journals_prom.load__journal_entry_obj_li}
@@ -35,16 +59,299 @@ let { log_lvl = 0, lq__journal_entry_obj }: Props = $props();
         {/await}
     </h2>
 
-    {$lq__journal_entry_obj?.private}
+    <div
-    {$lq__journal_entry_obj?.public}
+        class="flex flex-row gap-2 items-center justify-evenly w-full max-w-sm"
-    {$lq__journal_entry_obj?.personal}
+        >
-    {$lq__journal_entry_obj?.professional}
+        <!-- Entry alert status -->
+        <button
+            type="button"
+            onclick={() => {
+                if ($ae_loc.trusted_access) {
+                    let data_kv = {
+                        alert: $lq__journal_entry_obj?.alert ? false : true
+                        };
+                    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: log_lvl
+                    }).then(() => {
+                        // Optionally, you can provide feedback to the user
+                        // alert('Journal entry updated successfully!');
+                    }).catch((error) => {
+                        console.error('Error updating journal entry:', error);
+                        alert('Failed to update journal entry.');
+                    });
+                }
+            }}
+            class="btn-icon-sm"
+            title="Toggle alert status of this journal entry"
+            >
+            {#if $lq__journal_entry_obj?.alert}
+                <Siren strokeWidth="2.5" color="red" />
+            {:else}
+                <MessageSquareWarning strokeWidth="1" color="gray" />
+            {/if}
+        </button>
+
+        <!-- Entry alert message -->
+        <button
+            type="button"
+            onclick={() => {
+                if ($ae_loc.trusted_access) {
+                    let data_kv = {
+                        alert_msg: $lq__journal_entry_obj?.alert_msg ? false : true
+                        };
+                    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: log_lvl
+                    }).then(() => {
+                        // Optionally, you can provide feedback to the user
+                        // alert('Journal entry updated successfully!');
+                    }).catch((error) => {
+                        console.error('Error updating journal entry:', error);
+                        alert('Failed to update journal entry.');
+                    });
+                }
+            }}
+            class:hidden={!$lq__journal_entry_obj?.alert}
+            class="btn-icon-sm"
+            title="Toggle alert message of this journal entry"
+            >
+            {#if $lq__journal_entry_obj?.alert_msg}
+                <Skull strokeWidth="2.5" color="red" />
+            {:else}
+                <MessageSquareWarning strokeWidth="1" color="gray" />
+            {/if}
+        </button>
+
+
+        <button
+            type="button"
+            onclick={() => {
+                if ($ae_loc.trusted_access) {
+                    let data_kv = {
+                        private: $lq__journal_entry_obj?.private ? false : true
+                        };
+                    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: log_lvl
+                    }).then(() => {
+                        // Optionally, you can provide feedback to the user
+                        // alert('Journal entry updated successfully!');
+                    }).catch((error) => {
+                        console.error('Error updating journal entry:', error);
+                        alert('Failed to update journal entry.');
+                    });
+                }
+            }}
+            class="btn-icon-sm"
+            title="Save changes to this journal entry"
+            >
+            {#if $lq__journal_entry_obj?.private}
+                <Fingerprint strokeWidth="2.5" color="green" />
+            {:else}
+                <Fingerprint strokeWidth="1" color="gray" />
+            {/if}
+        </button>
+
+        <button
+            type="button"
+            onclick={() => {
+                if ($ae_loc.trusted_access) {
+                    let data_kv = {
+                        public: $lq__journal_entry_obj?.public ? false : true
+                        };
+                    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: log_lvl
+                    }).then(() => {
+                        // Optionally, you can provide feedback to the user
+                        // alert('Journal entry updated successfully!');
+                    }).catch((error) => {
+                        console.error('Error updating journal entry:', error);
+                        alert('Failed to update journal entry.');
+                    });
+                }
+            }}
+            class="btn-icon-sm"
+            title="Toggle public visibility of this journal entry"
+            >
+            {#if $lq__journal_entry_obj?.public}
+                <Globe strokeWidth="2.5" color="green" />
+            {:else}
+                <Globe strokeWidth="1" color="gray" />
+            {/if}
+        </button>
+
+        <button
+            type="button"
+            onclick={() => {
+                if ($ae_loc.trusted_access) {
+                    let data_kv = {
+                        personal: $lq__journal_entry_obj?.personal ? false : true
+                        };
+                    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: log_lvl
+                    }).then(() => {
+                        // Optionally, you can provide feedback to the user
+                        // alert('Journal entry updated successfully!');
+                    }).catch((error) => {
+                        console.error('Error updating journal entry:', error);
+                        alert('Failed to update journal entry.');
+                    });
+                }
+            }}
+            class="btn-icon-sm"
+            title="Toggle personal visibility of this journal entry"
+            >
+            {#if $lq__journal_entry_obj?.personal}
+                <BookHeart strokeWidth="2.5" color="green" />
+            {:else}
+                <BookHeart strokeWidth="1" color="gray" />
+            {/if}
+        </button>
+
+        <button
+            type="button"
+            onclick={() => {
+                if ($ae_loc.trusted_access) {
+                    let data_kv = {
+                        professional: $lq__journal_entry_obj?.professional ? false : true
+                        };
+                    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: log_lvl
+                    }).then(() => {
+                        // Optionally, you can provide feedback to the user
+                        // alert('Journal entry updated successfully!');
+                    }).catch((error) => {
+                        console.error('Error updating journal entry:', error);
+                        alert('Failed to update journal entry.');
+                    });
+                }
+            }}
+            class="btn-icon-sm"
+            title="Toggle professional visibility of this journal entry"
+            >
+            {#if $lq__journal_entry_obj?.professional}
+                <BriefcaseBusiness strokeWidth="2.5" color="green" />
+            {:else}
+                <BriefcaseBusiness strokeWidth="1" />
+            {/if}
+        </button>
+
+        <!-- <button
+            type="button"
+            onclick={() => {
+                if ($ae_loc.trusted_access) {
+                    let data_kv = {
+                        shared: $lq__journal_entry_obj?.shared ? false : true
+                        };
+                    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: log_lvl
+                    }).then(() => {
+                        // Optionally, you can provide feedback to the user
+                        // alert('Journal entry updated successfully!');
+                    }).catch((error) => {
+                        console.error('Error updating journal entry:', error);
+                        alert('Failed to update journal entry.');
+                    });
+                }
+            }}
+            class="btn-icon-sm"
+            title="Toggle shared visibility of this journal entry"
+            >
+            {#if $lq__journal_entry_obj?.shared}
+                <Share2 strokeWidth="2.5" color="green" />
+            {:else}
+                <Share2 strokeWidth="1" color="gray" />
+            {/if}
+        </button> -->
+
+    </div>
+
 </header>
 
-<pre>
+<pre
+    ondblclick={() => {
+    if ($ae_loc.trusted_access) {
+        // Toggle edit mode
+        $journals_loc.entry.edit = !$journals_loc.entry.edit;
+        $journals_loc.entry.edit_kv[$lq__journal_entry_obj?.journal_entry_id] = $journals_loc.entry.edit;
+    }
+    }}
+    class:hidden={!$ae_loc.trusted_access || $journals_loc.entry.edit_kv[$lq__journal_entry_obj?.journal_entry_id]}
+    >
 {$lq__journal_entry_obj?.content}
 </pre>
 
+<div class="flex flex-col items-center justify-center w-full max-w-6xl">
+
+<textarea
+    bind:value={tmp_entry_obj.content}
+    ondblclick={() => {
+    if ($ae_loc.trusted_access) {
+        // Toggle edit mode
+        $journals_loc.entry.edit = !$journals_loc.entry.edit;
+        $journals_loc.entry.edit_kv[$lq__journal_entry_obj?.journal_entry_id] = $journals_loc.entry.edit;
+    }
+    }}
+    class:hidden={!$ae_loc.trusted_access || !$journals_loc.entry.edit_kv[$lq__journal_entry_obj?.journal_entry_id]}
+    class="w-full min-h-10 h-96 p-2 border border-gray-300 rounded-lg"
+    placeholder="Edit journal entry content here..."
+    ></textarea>
+
+    <button
+        type="button"
+        onclick={() => {
+            // Save the updated journal entry content
+            if ($ae_loc.trusted_access) {
+                // Call API to save the content
+                let data_kv = {
+                    content: tmp_entry_obj?.content
+                };
+                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: log_lvl
+                }).then(() => {
+                    // Optionally, you can provide feedback to the user
+                    alert('Journal entry updated successfully!');
+                }).catch((error) => {
+                    console.error('Error updating journal entry:', error);
+                    alert('Failed to update journal entry.');
+                });
+            }
+        }}
+        class="
+            btn btn-sm md:btn-md lg:btn-lg
+            variant-soft-primary hover:variant-filled-primary
+            min-w-72 w-full lg:min-w-96
+            max-w-96
+            "
+        >
+        Save Changes
+    </button>
+
+</div>
+
+
 <div>
 {$lq__journal_entry_obj?.keywords}
 {#if $ae_loc.trusted_access && $ae_loc.edit_mode}
@@ -52,4 +359,6 @@ let { log_lvl = 0, lq__journal_entry_obj }: Props = $props();
 {/if}
 </div>
 
+{/if}
+
 </section>

src/routes/journals/ae_comp__journal_entry_obj_li.svelte

@@ -1,13 +1,18 @@
 <script lang="ts">
+let log_lvl: number = 1;
+
 // *** Import Svelte specific
 import { goto, invalidate, pushState, replaceState } from '$app/navigation';
 
+import { NotebookText, Shapes } from '@lucide/svelte';
+
+
 // *** Import Aether specific variables and functions
 import type { key_val } from '$lib/ae_stores';
 import { ae_util } from '$lib/ae_utils/ae_utils';
 import { api } from '$lib/api';
 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 } from '$lib/ae_journals/ae_journals_stores';
+import { journals_loc, journals_sess, journals_slct, journals_trig } from '$lib/ae_journals/ae_journals_stores';
 
 interface Props {
     lq__journal_entry_obj_li: any;
@@ -40,25 +45,68 @@ let ae_promises: key_val = $state({});
         class:bg-warning-100={!journals_journal_entry_obj?.enable}
         >
 
-        <header class="ae_header flex flex-row gap-2 items-center">
+        <header class="ae_header flex flex-row gap-2 items-center justify-between w-full">
+            <a
+                href="/journals/{journals_journal_entry_obj?.journal_id}/entry/{journals_journal_entry_obj?.journal_entry_id}"
+                class="btn btn-secondary variant-ghost-primary hover:variant-filled-primary transition"
+                title={`View: ${journals_journal_entry_obj?.name}`}
+                >
+                <NotebookText class="m-1"/>
+                <span class="hidden md:inline">
+                View
+                </span>
+            </a>
+
+            {#if journals_journal_entry_obj.category_code}
+                <!-- When clicked, this will filter by the category code. -->
+                <button
+                    type="button"
+                    onclick={() => {
+                        if (log_lvl) {
+                            console.log('$journals_loc.filter__category_code', $journals_loc.filter__category_code);
+                        }
+                        if ($journals_loc.filter__category_code == journals_journal_entry_obj.category_code) {
+                            $journals_loc.filter__category_code = null;
+                        } else {
+                            $journals_loc.filter__category_code = journals_journal_entry_obj.category_code;
+                        }
+                        // $journals_loc = {
+                        //     ...$journals_loc,
+                        // };
+                        $journals_trig.journal_entry_li = true;
+                        if (log_lvl) {
+                            console.log('$journals_loc.filter__category_code', $journals_loc.filter__category_code);
+                        }
+                    }}
+                    class="btn variant-ghost-secondary hover:variant-filled-secondary transition"
+                    title={`Filter by category: ${journals_journal_entry_obj.category_code}`}
+                    >
+                    <Shapes class="m-1 inline-block"/>
+                    {journals_journal_entry_obj.category_code ?? '-- no category --'}
+                </button>
+            {/if}
+
             <h3 class="journal__name h4">
-                <span class="journal__name">{@html journals_journal_entry_obj.name}</span>
+                <span class="journal__name">{@html journals_journal_entry_obj.name ?? ae_util.iso_datetime_formatter(journals_journal_entry_obj.created_on, 'datetime_iso_12_no_seconds')}</span>
             </h3>
         </header>
 
+
+
+
         {#if journals_journal_entry_obj.content}<pre class="journal__content p-2 bg-white shadow-md rounded-lg text-wrap text-sm font-normal whitespace-pre-wrap">{@html journals_journal_entry_obj.content}</pre>{/if}
 
-        <div class="ae_options flex flex-row flex-wrap gap-2 items-center justify-center">
+        <!-- <div class="ae_options flex flex-row flex-wrap gap-2 items-center justify-center"> -->
 
-            <a
+            <!-- <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}`}
                 >
-                <span class="fas fa-eye m-1"></span> View
+                <NotebookText class="m-1"/> View
-            </a>
+            </a> -->
 
-            {#if $ae_loc.trusted_access && $ae_loc.edit_mode}
+            <!-- {#if $ae_loc.trusted_access && $ae_loc.edit_mode}
                 <button
                     type="button"
                     disabled={!$ae_loc.trusted_access}
@@ -74,11 +122,11 @@ let ae_promises: key_val = $state({});
                     >
                     <span class="fas fa-edit m-1"></span> Edit
                 </button>
-            {/if}
+            {/if} -->
-        </div>
+        <!-- </div> -->
 
         <section class="ae_section journal_entry__entry">
-            {#if journals_journal_entry_obj?.description}
+            <!-- {#if journals_journal_entry_obj?.description}
             <div
                 class="journal_entry__description ae_description"
                 >
@@ -87,9 +135,9 @@ let ae_promises: key_val = $state({});
                     {@html journals_journal_entry_obj?.description}
                 </div>
             </div>
-            {/if}
+            {/if} -->
 
-            {#if journals_journal_entry_obj?.entry_html}
+            <!-- {#if journals_journal_entry_obj?.entry_html}
             <div
                 class="journal_entry__entry_html ae_entry_html"
                 >
@@ -98,7 +146,7 @@ let ae_promises: key_val = $state({});
                     {@html journals_journal_entry_obj?.entry_html}
                 </div>
             </div>
-            {/if}
+            {/if} -->
 
             <div
                 class="ae_group"

src/routes/journals/ae_comp__journal_obj_li.svelte

@@ -62,6 +62,7 @@ let { lq__journal_obj_li }: Props = $props();
 
             {#if $ae_loc.administrator_access && $ae_loc.edit_mode}
                 <button
+                    type="button"
                     disabled={!$ae_loc.administrator_access}
                     onclick={() => {
                         $journals_slct.journal_id = journals_journal_obj.journal_id;