Mostly working with event file reports being moved out.

src/routes/events/ae_comp__event_file_obj_tbl.svelte

@@ -3,6 +3,7 @@ interface Props {
     // Exports
     container_class_li?: string|Array<string>;
     event_file_id_random_li?: Array<string>;
+    lq__event_file_obj_li: any;
     allow_basic?: boolean;
     allow_moderator?: boolean;
     // export let max_records: number = 100;
@@ -12,18 +13,21 @@ interface Props {
     // export let show_presenter_fields: boolean = false;
     show_session_fields?: boolean;
     hide_session_code?: boolean;
+    log_lvl?: number;
 }
 
 let {
     container_class_li = [],
     event_file_id_random_li = [],
+    lq__event_file_obj_li,
     allow_basic = false,
     allow_moderator = false,
-    show_direct_download = false,
+    show_direct_download = $bindable(false),
     show_location_fields = false,
     show_presentation_fields = false,
     show_session_fields = false,
-    hide_session_code = false
+    hide_session_code = false,
+    log_lvl = $bindable(0),
 }: Props = $props();
 
 // Imports
@@ -46,17 +50,7 @@ import MyClipboard from '$lib/e_app_clipboard.svelte';
 let ae_promises: key_val = $state({});
 
 // *** Functions and Logic
-// let lq__event_file_obj = liveQuery(
-//     () => db_events.files.get($events_slct.event_file_id)
-// );
 
-let lq_kv__event_file_obj_li = $derived(liveQuery(async () => {
-// let lq_kv__event_file_obj_li = liveQuery(
-    let results = await db_events.files
-        .bulkGet(event_file_id_random_li);
-
-    return results;
-}));
 
 // Define the list of unacceptable characters if not using the default.
 // const unacceptable_chars = /[ <>:"/\\|?*]/g;
@@ -74,6 +68,7 @@ $effect(() => {
         // console.log('Element fits within the container. No horizontal scrolling.', horiz_check_element);
     }
 });
+
 </script>
 
 
@@ -84,31 +79,137 @@ $effect(() => {
     class="ae_comp event_file_obj_tbl {container_class_li} container overflow-auto max-w-screen">
 
 
-{#if event_file_id_random_li && $lq_kv__event_file_obj_li && $lq_kv__event_file_obj_li?.length > 0 && $lq_kv__event_file_obj_li?.length == event_file_id_random_li?.length}
+<!-- {#if event_file_id_random_li && $lq_kv__event_file_obj_li && $lq_kv__event_file_obj_li?.length > 0 && $lq_kv__event_file_obj_li?.length == event_file_id_random_li?.length} -->
+{#if $lq__event_file_obj_li && $lq__event_file_obj_li?.length}
 
 <div
     bind:this={horiz_check_element}
     id="tbl_container"
     class="space-y-2 pb-8"
     >
-<h2 class="h3">
-    <span class="text-base">
-    Results:
-    </span>
+<header
+    class="flex flex-row flex-wrap gap-1 items-center justify-between"
+    >
+    <h2 class="h3">
+        <span class="text-base">
+        Results:
+        </span>
 
-    {#if $lq_kv__event_file_obj_li.length}
-    <span
-        class="text-3xl font-bold preset-filled-success-100-900 px-4 rounded-lg"
-        title="Count {$lq_kv__event_file_obj_li.length ?? 'None'}"
+        {#if $lq__event_file_obj_li.length}
+        <span
+            class="text-3xl font-bold preset-filled-success-100-900 px-4 rounded-lg"
+            title="Count {$lq__event_file_obj_li.length ?? 'None'}"
+            >
+            <span class="fas fa-list-ol mx-4"></span>
+            {$lq__event_file_obj_li.length ?? 'None'}&times;
+        </span>
+        {/if}
+    </h2>
+
+    <div
+        class="flex flex-row flex-wrap gap-1 items-center justify-end"
+        class:hidden={!$ae_loc.edit_mode}
         >
-        <span class="fas fa-list-ol mx-4"></span>
-        {$lq_kv__event_file_obj_li.length ?? 'None'}&times;
-    </span>
+    <button
+        class="btn btn-sm preset-tonal-warning border border-warning-500 mb-1 generate_csv_btn"
+        onclick={() => {
+            if (!confirm('Generate and download a CSV file with the file list?')) {
+                return false;
+            }
+
+            let csv_data = generate_file_export_csv($lq__event_file_obj_li);
+            console.log('CSV Data:', csv_data);
+        }}
+        >
+        <span class="fas fa-file-csv mx-1"></span>
+        Export Presenters CSV
+    </button>
+    <span id="download_csv_container"></span>
+
+
+    {#if show_session_fields}
+        <button
+            type="button"
+            onclick={() => {
+                show_session_fields = !show_session_fields;
+            }}
+            class="btn btn-sm {show_session_fields ? 'ae_btn_surface' : 'ae_btn_surface_outlined'}"
+            title="Show or hide the session-related column fields."
+            >
+            <span class="fas fa-toggle-on m-1"></span>
+            Showing Session Fields
+        </button>
+    {:else}
+        <button
+            type="button"
+            onclick={() => {
+                show_session_fields = !show_session_fields;
+            }}
+            class="btn btn-sm {show_session_fields ? 'ae_btn_surface' : 'ae_btn_surface_outlined'}"
+            title="Show or hide the session-related column fields."
+            >
+            <span class="fas fa-toggle-off m-1"></span>
+            Show Session Fields
+        </button>
     {/if}
-</h2>
+
+    <!-- Show or hide the session code -->
+    {#if !hide_session_code}
+        <button
+            type="button"
+            onclick={() => {
+                hide_session_code = true;
+            }}
+            class="btn btn-sm ae_btn_surface"
+            title="Hide the session code column from view. Currently showing the Session Code column."
+            >
+            <span class="fas fa-toggle-on m-1"></span>
+            Showing Session Code
+        </button>
+    {:else}
+        <button
+            type="button"
+            onclick={() => {
+                hide_session_code = false;
+            }}
+            class="btn btn-sm ae_btn_surface_outlined"
+            title="Show the session code column. Currently hiding the Session Code column from view."
+            >
+            <span class="fas fa-toggle-off m-1"></span>
+            Show Session Code
+        </button>
+    {/if}
+
+    {#if show_presentation_fields}
+        <button
+            type="button"
+            onclick={() => {
+                show_presentation_fields = !show_presentation_fields;
+            }}
+            class="btn btn-sm {show_presentation_fields ? 'ae_btn_surface' : 'ae_btn_surface_outlined'}"
+            title="Show or hide the extra presentation-related column fields."
+            >
+            <span class="fas fa-toggle-on m-1"></span>
+            Showing Presentation Fields
+        </button>
+    {:else}
+        <button
+            type="button"
+            onclick={() => {
+                show_presentation_fields = !show_presentation_fields;
+            }}
+            class="btn btn-sm {show_presentation_fields ? 'ae_btn_surface' : 'ae_btn_surface_outlined'}"
+            title="Show or hide the extra presentation-related column fields."
+            >
+            <span class="fas fa-toggle-off m-1"></span>
+            Show Presentation Fields
+        </button>
+    {/if}
+    </div>
+
+</header>
 
 <table
-
     class="table table-auto table-striped w-full text-xs lg:text-sm"
     >
     <thead
@@ -117,7 +218,7 @@ $effect(() => {
         <tr>
             <th class="px-4 py-2">
                 Filename
-                <!-- ({$lq_kv__event_file_obj_li?.length}&times;) -->
+                <!-- ({$lq__event_file_obj_li?.length}&times;) -->
             </th>
             <th
                 class="px-4 py-2"
@@ -151,7 +252,7 @@ $effect(() => {
     </thead>
     <tbody
         class="">
-    {#each $lq_kv__event_file_obj_li as event_file_obj}
+    {#each $lq__event_file_obj_li as event_file_obj}
         <tr
             class:dim={event_file_obj?.hide}
             >