Now with the ability to edit a presentation name. Yay.

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

@@ -40,6 +40,8 @@ $events_slct.event_id = ae_acct.slct.event_id;
 $events_slct.event_obj = ae_acct.slct.event_obj;
 $events_slct.event_session_id = ae_acct.slct.event_session_id;
 $events_slct.event_session_obj = ae_acct.slct.event_session_obj;
+$events_slct.event_presentation_id = null;
+$events_slct.event_presentation_obj = null;
 $events_slct.event_presentation_obj_li = ae_acct.slct.event_presentation_obj_li;
 // $events_slct.event_file_obj_li = ae_acct.slct.event_file_obj_li;
 
@@ -837,16 +839,106 @@ function send_sign_in_poc_email(
             <li>
 
             <!-- Make sure to show the edit button only if the user has the correct permissions. Need to set the presentation ID in the store. -->
-            {#if $ae_loc.trusted_access || $events_loc.auth__kv.presentation[event_presentation_obj.event_presentation_id_random]}
+            {#if event_presentation_obj && ($ae_loc.trusted_access || $events_loc.auth__kv.presentation[event_presentation_obj.event_presentation_id_random])}
+
+            {#if $events_slct.event_presentation_id == event_presentation_obj.event_presentation_id_random && ae_tmp[$events_slct.event_presentation_id]?.show__edit_presentation_name}
             <button
                 type="button"
-                disabled
+                on:click={() => {
+                    console.log('Cancel edit presentation');
+                    ae_tmp[$events_slct.event_presentation_id].show__edit_presentation_name = false;
+
+                    // Careful with the trigger_patch. It will keep firing if not reset.
+                    ae_triggers.update_event_presentation_name = false;
+                }}
+                class="btn btn-sm variant-soft-warning float-right"
+                >
+                <span class="fas fa-times mx-1">
+                </span>
+                Cancel
+            </button>
+
+            {:else}
+            <button
+                type="button"
+                on:click={() => {
+                    console.log('Edit presentation title and description');
+                    $events_slct.event_presentation_id = event_presentation_obj.event_presentation_id_random;
+                    $events_slct.event_presentation_obj = event_presentation_obj;
+                    ae_tmp[$events_slct.event_presentation_id] = {
+                        show__edit_presentation_name: true,
+                    }
+                }}
                 title="Edit presentation title and description"
                 class="btn btn-sm variant-soft-warning float-right">
                 <span class="fas fa-edit mx-1">
                 </span>
-                Edit Presentation
+                Edit
             </button>
+            {/if}
+
+            {#if $events_slct.event_presentation_id == event_presentation_obj.event_presentation_id_random && ae_tmp[$events_slct.event_presentation_id]?.show__edit_presentation_name && $events_slct.event_presentation_obj}
+            <!-- Edit the presentation title -->
+            <Element_ae_crud
+                trigger_patch={ae_triggers.update_event_presentation_name}
+                api_cfg={$ae_api}
+                object_type={'event_presentation'}
+                object_id={$events_slct.event_presentation_obj.event_presentation_id_random}
+                field_name={'name'}
+                field_type={'input'}
+                field_value={$events_slct.event_presentation_obj.name}
+                allow_null={false}
+                hide_edit_btn={true}
+                outline_element={false}
+                show_crud={false}
+                display_inline={true}
+                class_li={'m-1'}
+                on:ae_crud_updated={e => {
+                    console.log(`ae_crud_updated:`, e.detail);
+
+                    events_func.handle_load_ae_obj_id__event_presentation({api_cfg: $ae_api, event_presentation_id: $events_slct.event_presentation_obj.event_presentation_id_random, log_lvl: 1})
+                    .then(function (load_results) {
+                        // We need to force reload the Indexed DB - Dexie.js?
+                        // Sometimes the changes are not seen. The file disappears when the Save button is pressed.
+
+                        // Maybe reload page?
+                        // window.location.reload();
+                    })
+                    .finally(function () {
+                        ae_tmp[$events_slct.event_presentation_id].show__edit_presentation_name = false;
+
+                        // Careful with the trigger_patch. It will keep firing if not reset.
+                        ae_triggers.update_event_presentation_name = false;
+                    });
+                    }}
+                >
+                <input
+                    bind:value={$events_slct.event_presentation_obj.name}
+                    class="input min-w-96 max-w-96 text-sm"
+                    />
+
+                <button
+                    type="button"
+                    on:click={() => {
+                        console.log('*** Save button clicked ***');
+                        // if (!confirm('Are you sure you want to save this event_presenter?')) {return false;}
+
+                        console.log(`Selected event_presentation_id: ${$events_slct.event_presentation_obj.event_presentation_id_random}`);
+
+                        ae_triggers.update_event_presentation_name = true;
+                        // ae_triggers.update_event_presentation_name = $events_slct.event_presentation_obj.event_presentation_id_random;
+                    }}
+                    class="btn btn-sm variant-soft-success hover:variant-ghost-success mx-1"
+                    >
+                    <span class="fas fa-save mx-1"></span>
+                    Save
+                </button>
+            </Element_ae_crud>
+            {/if}
+
+
+
+
             {/if}
 
             <h4 class="h5">

src/routes/events_pres_mgmt/session/[slug]/presenter_view.svelte

@@ -308,7 +308,12 @@ async function handle_delete__event_file({event_file_id}) {
 {#if $lq__event_presenter_obj}
 <h2 class="h3">
     Presenter Details for:<br>
-    <strong>{$events_slct.presenter_obj.full_name} ({$events_slct.presenter_obj.email})</strong>
+    <strong>
+        {$events_slct.presenter_obj.full_name}
+    </strong>
+    <span class="text-sm">
+        ({$events_slct.presenter_obj.email})
+    </span>
 
     {#if $ae_loc.trusted_access}
         <!-- A button to copy the access link to the clipboard. -->
@@ -329,67 +334,6 @@ async function handle_delete__event_file({event_file_id}) {
 
 <section class="p-2">
 <h3 class="h4">Title: "{$events_slct.presentation_obj.name}"</h3>
-<!-- Edit the presentation title -->
-<Element_ae_crud
-    trigger_patch={ae_triggers.update_event_presentation_name}
-    api_cfg={$ae_api}
-    object_type={'event_presentation'}
-    object_id={$events_slct.presentation_obj.event_presentation_id_random}
-    field_name={'name'}
-    field_type={'input'}
-    field_value={$events_slct.presentation_obj.name}
-    allow_null={false}
-    hide_edit_btn={true}
-    outline_element={false}
-    show_crud={false}
-    display_inline={true}
-    class_li={'m-1'}
-    on:ae_crud_updated={e => {
-        console.log(`ae_crud_updated:`, e.detail);
-
-        events_func.handle_load_ae_obj_id__event_presentation({api_cfg: $ae_api, event_presentation_id: $events_slct.presentation_obj.event_presentation_id_random, log_lvl: 1})
-        .then(function (load_results) {
-            // We need to force reload the Indexed DB - Dexie.js?
-            // Sometimes the changes are not seen. The file disappears when the Save button is pressed.
-
-            // Maybe reload page?
-            // window.location.reload();
-        })
-        .finally(function () {
-            // ae_tmp.show__file_li = false;
-            // Careful with the trigger_patch. It will keep firing if not reset.
-            ae_triggers.update_event_presentation_name = false;
-        });
-        }}
-    >
-    <input
-        bind:value={$events_slct.presentation_obj.name}
-        class="input min-w-96 max-w-96 text-sm"
-        />
-
-    <button
-        type="button"
-        on:click={() => {
-            console.log('*** Save button clicked ***');
-            // if (!confirm('Are you sure you want to save this event_presenter?')) {return false;}
-
-            console.log(`Selected event_presentation_id: ${$events_slct.presentation_obj.event_presentation_id_random}`);
-
-            ae_triggers.update_event_presentation_name = true;
-            // ae_triggers.update_event_presentation_name = $events_slct.presentation_obj.event_presentation_id_random;
-        }}
-        class="btn btn-sm variant-soft-success hover:variant-ghost-success mx-1"
-        >
-        <span class="fas fa-save mx-1"></span>
-        Save
-    </button>
-</Element_ae_crud>
-
-
-
-
-
-
 
 <h3 class="h4">Presenter:</h3>
 <ul