The badge does not yet render and are not fully working on the badge view ID page, but I am saving anyways. It at least works and seems to finally be moving in the right direction. It is partially related to the badge_template records not being saved to the badge_template.

src/routes/events/[event_id]/(badges)/badges/[badge_id]/+page.svelte

@@ -128,14 +128,14 @@
         </a>
     </header>
 
-    <!-- {#if $lq__event_badge_obj} -->
+    {#if $lq__event_badge_obj}
     <Comp_badge_obj_view
         event_id={$lq__event_badge_obj.event_id}
         {event_badge_id}
-        {lq__event_badge_obj}
+        lq__event_badge_obj={lq__event_badge_obj}
         {is_review_mode}
     />
-    <!-- {/if} -->
+    {/if}
 {:else}
     <p>No IDB record found for ID: {event_badge_id}</p>
 {/if}

src/routes/events/[event_id]/(badges)/badges/[badge_id]/ae_comp__badge_obj_view.svelte

@@ -96,19 +96,22 @@
 
     // Initialize editable fields when lq__event_badge_obj changes
     $effect(() => {
-        if (lq__event_badge_obj) {
+        if ($lq__event_badge_obj) {
+            if (log_lvl) {
+                console.log('Initializing editable fields from lq__event_badge_obj');
+            }
             editable_full_name_override =
-                lq__event_badge_obj.full_name_override ?? lq__event_badge_obj.full_name;
+                $lq__event_badge_obj.full_name_override ?? $lq__event_badge_obj.full_name;
             editable_professional_title_override =
-                lq__event_badge_obj.professional_title_override ??
+                $lq__event_badge_obj.professional_title_override ??
-                lq__event_badge_obj.professional_title;
+                $lq__event_badge_obj.professional_title;
             editable_affiliations_override =
-                lq__event_badge_obj.affiliations_override ?? lq__event_badge_obj.affiliations;
+                $lq__event_badge_obj.affiliations_override ?? $lq__event_badge_obj.affiliations;
             editable_location_override =
-                lq__event_badge_obj.location_override ?? lq__event_badge_obj.location;
+                $lq__event_badge_obj.location_override ?? $lq__event_badge_obj.location;
             editable_allow_tracking = lq__event_badge_obj.allow_tracking ?? null;
-            editable_email = lq__event_badge_obj.email ?? null;
+            editable_email = $lq__event_badge_obj.email ?? null;
-            editable_badge_type_code = lq__event_badge_obj.badge_type_code ?? null;
+            editable_badge_type_code = $lq__event_badge_obj.badge_type_code ?? null;
 
             if (is_review_mode) {
                 edit_mode_active = true;
@@ -125,7 +128,13 @@
 
     // These variables seem unused or redundant now with editable_ fields
     // let use_badge_type = $state(null);
-    // let use_badge_type_code = $state('');
+    let use_badge_type_code = $state('');
+    let option_ticket_1_override = $state('');
+    let option_ticket_2_override = $state('');
+    let option_ticket_3_override = $state('');
+    let option_other_1_override = $state('');
+    let option_other_2_override = $state('');
+
 
     let slct_badge_type = '';
 
@@ -168,98 +177,113 @@
 
     let lq__event_badge_template_obj = $derived(
         liveQuery(async () => {
-            if (log_lvl) {
+            let results = await db_events.badge_template.get($lq__event_badge_obj?.event_badge_id ?? ''); // null or undefined does not reset things like '' does
-                console.log(`*** LiveQuery: lq__event_obj *** event_id=${$events_slct.event_id}`);
-            }
-            let results = await db_events.badge_template.get(
-                $lq__event_badge_obj?.event_badge_template_id
-            );
 
-            // Re-calculate font sizes based on potentially edited values
+            // Check if results are different than the current session version stored under $events_slct
-            const current_full_name =
+            // if ($events_slct.event_badge_obj && results) {
-                editable_full_name_override ?? lq__event_badge_obj?.full_name ?? '';
+            //     if (JSON.stringify($events_slct.event_badge_obj) !== JSON.stringify(results)) {
-            const current_professional_title =
+            //         $events_slct.event_badge_obj = { ...results };
-                editable_professional_title_override ??
+            //     }
-                lq__event_badge_obj?.professional_title ??
+            // }
-                '';
-            const current_affiliations =
-                editable_affiliations_override ?? lq__event_badge_obj?.affiliations ?? '';
-            const current_location =
-                editable_location_override ?? lq__event_badge_obj?.location ?? '';
-
-            longest_full_name_override_part = longest_str_part(current_full_name);
-            if (longest_full_name_override_part >= 9) {
-                full_name_class_size = 'text-[.45in]';
-            } else if (longest_full_name_override_part >= 7) {
-                full_name_class_size = 'text-[.60in]';
-            } else {
-                full_name_class_size = 'text-[.75in]';
-            }
-
-            longest_professional_title_override_part = longest_str_part(current_professional_title);
-            if (longest_professional_title_override_part >= 13) {
-                professional_title_class_size = 'text-[.35in]';
-            } else if (longest_professional_title_override_part >= 10) {
-                professional_title_class_size = 'text-[.35in]';
-            } else if (longest_professional_title_override_part >= 7) {
-                professional_title_class_size = 'text-[.35in]';
-            } else {
-                professional_title_class_size = 'text-[.35in]';
-            }
-
-            longest_affiliations_override_part = longest_str_part(current_affiliations);
-            if (longest_affiliations_override_part >= 55) {
-                affiliations_class_size = 'text-[.30in]';
-            } else if (longest_affiliations_override_part >= 45) {
-                affiliations_class_size = 'text-[.35in]';
-            } else if (longest_affiliations_override_part >= 35) {
-                affiliations_class_size = 'text-[.35in]';
-            } else if (longest_affiliations_override_part >= 25) {
-                affiliations_class_size = 'text-[.40in]';
-            } else if (longest_affiliations_override_part >= 20) {
-                affiliations_class_size = 'text-[.40in]';
-            } else if (longest_affiliations_override_part >= 7) {
-                affiliations_class_size = 'text-[.40in]';
-            } else {
-                affiliations_class_size = 'text-[.60in]';
-            }
-            if (affiliations_class_size > full_name_class_size) {
-                affiliations_class_size = full_name_class_size;
-            }
-
-            longest_location_override_part = longest_str_part(current_location);
-            if (longest_location_override_part >= 55) {
-                location_class_size = 'text-[.30in]';
-            } else if (longest_location_override_part >= 45) {
-                location_class_size = 'text-[.35in]';
-            } else if (longest_location_override_part >= 35) {
-                location_class_size = 'text-[.35in]';
-            } else if (longest_location_override_part >= 25) {
-                location_class_size = 'text-[.35in]';
-            } else if (longest_location_override_part >= 20) {
-                location_class_size = 'text-[.35in]';
-            } else if (longest_location_override_part >= 15) {
-                location_class_size = 'text-[.35in]';
-            } else {
-                location_class_size = 'text-[.35in]';
-            }
-            if (location_class_size > professional_title_class_size) {
-                location_class_size = professional_title_class_size;
-            } else if (professional_title_class_size > location_class_size) {
-                professional_title_class_size = location_class_size;
-            }
-
-            // These are no longer needed as we use the editable fields directly
-            // option_other_1_override = $lq__event_badge_obj?.option_other_1_override ?? $lq__event_badge_obj?.option_other_1;
-            // option_other_2_override = $lq__event_badge_obj?.option_other_2_override ?? $lq__event_badge_obj?.option_other_2;
-            // option_ticket_1_override = $lq__event_badge_obj?.option_ticket_1_override ?? $lq__event_badge_obj?.option_ticket_1;
-            // option_ticket_2_override = $lq__event_badge_obj?.option_ticket_2_override ?? $lq__event_badge_obj?.option_ticket_2;
-            // option_ticket_3_override = $lq__event_badge_obj?.option_ticket_3_override ?? $lq__event_badge_obj?.option_ticket_3;
 
             return results;
         })
     );
 
+    // let lq__event_badge_template_obj: any = $state(null);
+
+    // $effect(() => {
+    //     if ($lq__event_badge_obj?.event_badge_template_id) {
+    //         const sub = liveQuery(() =>
+    //             db_events.badge_template.get($lq__event_badge_obj.event_badge_template_id)
+    //         ).subscribe((val) => {
+    //             lq__event_badge_template_obj = val;
+    //         });
+    //         return () => sub.unsubscribe();
+    //     } else {
+    //         lq__event_badge_template_obj = null;
+    //     }
+    // });
+
+    $effect(() => {
+        // Re-calculate font sizes based on potentially edited values
+        // Only run if we have the badge object
+        if (!$lq__event_badge_obj) return;
+
+        const current_full_name =
+            editable_full_name_override ?? $lq__event_badge_obj.full_name ?? '';
+        const current_professional_title =
+            editable_professional_title_override ??
+            $lq__event_badge_obj.professional_title ??
+            '';
+        const current_affiliations =
+            editable_affiliations_override ?? $lq__event_badge_obj.affiliations ?? '';
+        const current_location =
+            editable_location_override ?? $lq__event_badge_obj.location ?? '';
+
+        let longest_full_name_override_part = longest_str_part(current_full_name);
+        if (longest_full_name_override_part >= 9) {
+            full_name_class_size = 'text-[.45in]';
+        } else if (longest_full_name_override_part >= 7) {
+            full_name_class_size = 'text-[.60in]';
+        } else {
+            full_name_class_size = 'text-[.75in]';
+        }
+
+        let longest_professional_title_override_part = longest_str_part(current_professional_title);
+        if (longest_professional_title_override_part >= 13) {
+            professional_title_class_size = 'text-[.35in]';
+        } else if (longest_professional_title_override_part >= 10) {
+            professional_title_class_size = 'text-[.35in]';
+        } else if (longest_professional_title_override_part >= 7) {
+            professional_title_class_size = 'text-[.35in]';
+        } else {
+            professional_title_class_size = 'text-[.35in]';
+        }
+
+        let longest_affiliations_override_part = longest_str_part(current_affiliations);
+        if (longest_affiliations_override_part >= 55) {
+            affiliations_class_size = 'text-[.30in]';
+        } else if (longest_affiliations_override_part >= 45) {
+            affiliations_class_size = 'text-[.35in]';
+        } else if (longest_affiliations_override_part >= 35) {
+            affiliations_class_size = 'text-[.35in]';
+        } else if (longest_affiliations_override_part >= 25) {
+            affiliations_class_size = 'text-[.40in]';
+        } else if (longest_affiliations_override_part >= 20) {
+            affiliations_class_size = 'text-[.40in]';
+        } else if (longest_affiliations_override_part >= 7) {
+            affiliations_class_size = 'text-[.40in]';
+        } else {
+            affiliations_class_size = 'text-[.60in]';
+        }
+        if (affiliations_class_size > full_name_class_size) {
+            affiliations_class_size = full_name_class_size;
+        }
+
+        let longest_location_override_part = longest_str_part(current_location);
+        if (longest_location_override_part >= 55) {
+            location_class_size = 'text-[.30in]';
+        } else if (longest_location_override_part >= 45) {
+            location_class_size = 'text-[.35in]';
+        } else if (longest_location_override_part >= 35) {
+            location_class_size = 'text-[.35in]';
+        } else if (longest_location_override_part >= 25) {
+            location_class_size = 'text-[.35in]';
+        } else if (longest_location_override_part >= 20) {
+            location_class_size = 'text-[.35in]';
+        } else if (longest_location_override_part >= 15) {
+            location_class_size = 'text-[.35in]';
+        } else {
+            location_class_size = 'text-[.35in]';
+        }
+        if (location_class_size > professional_title_class_size) {
+            location_class_size = professional_title_class_size;
+        } else if (professional_title_class_size > location_class_size) {
+            professional_title_class_size = location_class_size;
+        }
+    });
+
     // *** Functions and Logic
     function preventDefault<T extends Event>(fn: (event: T) => void) {
         return function (event: T) {
@@ -346,7 +370,7 @@
     }
 
     async function handle_save_changes() {
-        if (!lq__event_badge_obj?.event_badge_id_random) {
+        if (!$lq__event_badge_obj?.event_badge_id_random) {
             console.error('Cannot save changes: event_badge_id_random is missing.');
             return;
         }
@@ -359,36 +383,36 @@
         // Only include fields that have actually changed
         if (
             editable_full_name_override !==
-            (lq__event_badge_obj.full_name_override ?? lq__event_badge_obj.full_name)
+            ($lq__event_badge_obj.full_name_override ?? $lq__event_badge_obj.full_name)
         ) {
             data_to_update.full_name_override = editable_full_name_override;
         }
         if (
             editable_professional_title_override !==
-            (lq__event_badge_obj.professional_title_override ??
+            ($lq__event_badge_obj.professional_title_override ??
-                lq__event_badge_obj.professional_title)
+                $lq__event_badge_obj.professional_title)
         ) {
             data_to_update.professional_title_override = editable_professional_title_override;
         }
         if (
             editable_affiliations_override !==
-            (lq__event_badge_obj.affiliations_override ?? lq__event_badge_obj.affiliations)
+            ($lq__event_badge_obj.affiliations_override ?? $lq__event_badge_obj.affiliations)
         ) {
             data_to_update.affiliations_override = editable_affiliations_override;
         }
         if (
             editable_location_override !==
-            (lq__event_badge_obj.location_override ?? lq__event_badge_obj.location)
+            ($lq__event_badge_obj.location_override ?? $lq__event_badge_obj.location)
         ) {
             data_to_update.location_override = editable_location_override;
         }
-        if (editable_allow_tracking !== lq__event_badge_obj.allow_tracking) {
+        if (editable_allow_tracking !== $lq__event_badge_obj.allow_tracking) {
             data_to_update.allow_tracking = editable_allow_tracking;
         }
-        if (editable_email !== lq__event_badge_obj.email) {
+        if (editable_email !== $lq__event_badge_obj.email) {
             data_to_update.email = editable_email;
         }
-        if (editable_badge_type_code !== lq__event_badge_obj.badge_type_code) {
+        if (editable_badge_type_code !== $lq__event_badge_obj.badge_type_code) {
             data_to_update.badge_type_code = editable_badge_type_code;
         }
 
@@ -406,7 +430,8 @@
         try {
             await events_func.update_ae_obj__event_badge({
                 api_cfg: $ae_api,
-                event_badge_id: lq__event_badge_obj.event_badge_id_random,
+                event_id: event_id,
+                event_badge_id: $lq__event_badge_obj.event_badge_id_random,
                 data_kv: data_to_update,
                 log_lvl: log_lvl
             });
@@ -416,7 +441,7 @@
                 edit_mode_active = false;
                 $ae_loc.edit_mode = false;
             }
-            // Optionally, refresh the lq__event_badge_obj if needed, though Dexie might handle it
+            // Optionally, refresh the $lq__event_badge_obj if needed, though Dexie might handle it
         } catch (error) {
             console.error('Error saving changes:', error);
             update_status = 'error';
@@ -425,19 +450,19 @@
     }
 
     function handle_cancel_changes() {
-        if (lq__event_badge_obj) {
+        if ($lq__event_badge_obj) {
             editable_full_name_override =
-                lq__event_badge_obj.full_name_override ?? lq__event_badge_obj.full_name;
+                $lq__event_badge_obj.full_name_override ?? $lq__event_badge_obj.full_name;
             editable_professional_title_override =
-                lq__event_badge_obj.professional_title_override ??
+                $lq__event_badge_obj.professional_title_override ??
-                lq__event_badge_obj.professional_title;
+                $lq__event_badge_obj.professional_title;
             editable_affiliations_override =
-                lq__event_badge_obj.affiliations_override ?? lq__event_badge_obj.affiliations;
+                $lq__event_badge_obj.affiliations_override ?? $lq__event_badge_obj.affiliations;
             editable_location_override =
-                lq__event_badge_obj.location_override ?? lq__event_badge_obj.location;
+                $lq__event_badge_obj.location_override ?? $lq__event_badge_obj.location;
-            editable_allow_tracking = lq__event_badge_obj.allow_tracking ?? null;
+            editable_allow_tracking = $lq__event_badge_obj.allow_tracking ?? null;
-            editable_email = lq__event_badge_obj.email ?? null;
+            editable_email = $lq__event_badge_obj.email ?? null;
-            editable_badge_type_code = lq__event_badge_obj.badge_type_code ?? null;
+            editable_badge_type_code = $lq__event_badge_obj.badge_type_code ?? null;
         }
         if (!is_review_mode) {
             edit_mode_active = false;
@@ -787,7 +812,7 @@ onkeypress={() => {
                     </div>
                 {/if}
 
-                {#if ['front_bool', 'front_back_bool'].includes(option_ticket_1_display_opt) || ['front_bool', 'front_back_bool'].includes(option_ticket_2_display_opt) || ['front_bool', 'front_back_bool'].includes(option_ticket_3_display_opt) || $lq__event_badge_template_obj.show_qr_front || edit_mode_active}
+                {#if ['front_bool', 'front_back_bool'].includes(option_ticket_1_display_opt) || ['front_bool', 'front_back_bool'].includes(option_ticket_2_display_opt) || ['front_bool', 'front_back_bool'].includes(option_ticket_3_display_opt) || lq__event_badge_template_obj.show_qr_front || edit_mode_active}
                     <div class="special">
                         <span class="badge_body_special_left">
                             {#if option_ticket_1_override}<span
@@ -802,7 +827,7 @@ onkeypress={() => {
                                 <span class="ticket_3_code fg_blue fas fa-star"></span>
                             {/if}
                         </span>
-                        {#if $lq__event_badge_template_obj.show_qr_front}
+                        {#if lq__event_badge_template_obj.show_qr_front}
                             {#await qr_data_url}
                                 Generating...
                             {:then result}
@@ -876,7 +901,7 @@ onkeypress={() => {
                 {/if}
             </div>
 
-            <!-- {#if $lq__event_badge_template_obj.show_qr_front}
+            <!-- {#if lq__event_badge_template_obj.show_qr_front}
     <div class="container qr_code">
         {#await initial_loading_promise}
             Generating...
@@ -1385,7 +1410,7 @@ onkeypress={() => {
         </section>
         <!-- *** ticket section end *** -->
     {/if}
-    <!-- End if for lq__event_badge_template_obj -->
+    <!-- End if for $lq__event_badge_template_obj -->
 </section>
 
 <pre
@@ -1395,3 +1420,11 @@ onkeypress={() => {
         ">
     {JSON.stringify($lq__event_badge_obj, null, 2)}
 </pre>
+
+<pre
+    class="whitespace-pre-wrap break-words text-xs max-h-32 overflow-auto p-2 bg-surface-200 border border-surface-300 rounded
+        mt-4
+        print:hidden
+        ">
+    {JSON.stringify($lq__event_badge_template_obj, null, 2)}
+</pre>