Just working on select option list and related.

src/lib/ae_stores.ts

@@ -36,13 +36,14 @@ export type key_val = {
 
 // *** BEGIN *** Longer-term app data. This should be stored to local storage.
 export let ae_app_local_data_struct: key_val = {
-    'ver': '2024-05-01_15',
+    'ver': '2024-06-25_14',
     'name': 'Aether - App Hub (SvelteKit 2.x Svelte 4.x)',
     'theme': 'light',
     'iframe': false,
     'title': `OSIT's Æ`, // - Dev SvelteKit`, // Æ
 
     'debug': false, // A simple flag to know if we should show debug information.
+    'edit_mode': false, // A simple flag to know if we should show edit mode options.
 
     'account_id': ae_account_id, // OSIT Demo _XY7DXtc9MY
     'account_code': 'not_set',

src/routes/+layout.svelte

@@ -1,6 +1,7 @@
 <script lang="ts">
 /** @type {import('./$types').LayoutData} */
 export let data: any;
+let log_lvl = 0;
 // console.log(`ae_ Svelte root +layout data:`, data);
 
 import { onMount } from 'svelte';
@@ -214,8 +215,10 @@ onMount(() => {
 
 
     window.addEventListener('message', function(event) {
-        console.log('Message received in root +layout.svelte:');
-        console.log(event);
+        if (log_lvl) {
+            console.log('Message received in root +layout.svelte:');
+            console.log(event);
+        }
 
         if (event.data.type == 'api_download_blob') {
             console.log('Download blob (file) message received:', event.data);

src/routes/events_pres_mgmt/session/[slug]/+page.svelte

@@ -120,6 +120,9 @@ let lq__event_file_obj_li = liveQuery(
     () => db_events.files.where('event_session_id_random').equals($events_slct.event_session_id).toArray()
 );
 
+
+$slct.person_obj_kv = {}; // This is intended for the POC lookup list when generated.
+
 // Load the Event Obj with ID based on the slug param.
 // $events_slct.event_id = param_slug_event_id;
 // console.log('Selected Event ID:', $events_slct.event_id);
@@ -555,12 +558,13 @@ function send_sign_in_poc_email(
             object_type={'event_session'}
             object_id={$lq__event_session_obj?.event_session_id_random}
             field_name={'poc_person_id_random'}
-            field_type={'button'}
+            field_type={'select'}
             field_value={ae_tmp.poc_person_id}
+            select_option_li={$slct.person_obj_kv}
             allow_null={false}
             hide_edit_btn={true}
             outline_element={false}
-            show_crud={false}
+            show_crud={ae_tmp.show__edit_poc_person}
             display_inline={true}
             class_li={'m-1'}
             on:ae_crud_updated={e => {
@@ -582,7 +586,7 @@ function send_sign_in_poc_email(
                 <span class="fas fa-spinner fa-spin mx-1"></span>
             {:then person_obj_li}
             {#if  person_obj_li && person_obj_li.length > 0}
-                <label class="text-sm">PoC:
+                <!-- <label class="text-sm">PoC:
                 <select
                     bind:value={ae_tmp.poc_person_id}
                     class="select min-w-fit max-w-md text-sm"
@@ -595,7 +599,6 @@ function send_sign_in_poc_email(
                         >
                         {person_obj.full_name}
                         ({person_obj.primary_email})
-                        <!-- (ID: {person_obj.person_id_random}) -->
                     </option>
                 {/each}
                 </select>
@@ -616,7 +619,7 @@ function send_sign_in_poc_email(
                     >
                     <span class="fas fa-save mx-1"></span>
                     Save
-                </button>
+                </button> -->
             {/if}
             {/await}
 
@@ -639,14 +642,35 @@ function send_sign_in_poc_email(
             {:else}
             <button
                 type="button"
-                on:click={() => {
+                on:click={async () => {
                     console.log('Edit the POC person for the session.');
 
                     let params = {
                         qry__limit: 300,
                     }
 
-                    $slct.person_obj_li = core_func.handle_load_ae_obj_li__person({api_cfg: $ae_api, account_id: $slct.account_id, params: params});
+                    // $slct.person_obj_li = await core_func.handle_load_ae_obj_li__person({api_cfg: $ae_api, account_id: $slct.account_id, params: params});
+
+                    $slct.person_obj_li = core_func.handle_load_ae_obj_li__person({api_cfg: $ae_api, account_id: $slct.account_id, params: params})
+                    .then(function (load_results) {
+                        console.log(`Loaded person_obj_li:`, load_results);
+
+                        // We need to make this ready for the select option list. Convert the list to a key value pair with the person_id_random as the key. We also need to set the option text value to: full_name (primary_email)
+                        if (load_results) {
+                            let person_obj_li = load_results;
+                            let person_obj_kv = {};
+                            person_obj_kv[''] = '-- Select a person --';
+                            person_obj_li.forEach((person_obj) => {
+                                let option_text = `${person_obj.full_name} (${person_obj.primary_email})`;
+                                person_obj_kv[person_obj.person_id_random] = option_text;
+                            });
+                            $slct.person_obj_kv = person_obj_kv;
+                        }
+                        $slct.person_obj_kv = $slct.person_obj_kv;
+                        console.log(`$slct.person_obj_kv = `, $slct.person_obj_kv);
+
+                        return load_results;
+                    });
 
                     ae_tmp.poc_person_id = $lq__event_session_obj?.poc_person_id_random;
                     ae_tmp.show__edit_poc_person = true;