<script lang="ts">
interface Props {
    lq__event_presentation_obj: any;
    session_type?: string;
}

let { lq__event_presentation_obj, session_type = '' }: Props = $props();

import { liveQuery } from 'dexie';
import { db_events } from '$lib/ae_events/db_events';
import { ae_loc, ae_api } from '$lib/stores/ae_stores';
import { events_sess } from '$lib/stores/ae_events_stores';
import { launcher_loc } from '$lib/stores/ae_events_stores__launcher.svelte';
import { events_func } from '$lib/ae_events/ae_events_functions';
import Event_launcher_file_cont from './launcher_file_cont.svelte';

// Staggered Load: Trigger deep fetch only when the presentation ID changes.
// WHY: The SWR pattern in load_ae_obj_id__event_presentation always fires a
// background API call that writes to Dexie. That Dexie write triggers the
// liveQuery upstream, which updates the lq__event_presentation_obj prop,
// which re-runs this $effect — creating an infinite loop that crashes the tab.
// Guarding on last_loaded_id breaks the loop: the effect only makes an API
// call when we see a new presentation ID, not on every downstream prop update.
let last_loaded_id: string | null = null;
$effect(() => {
    const id = lq__event_presentation_obj?.event_presentation_id;
    if (id && id !== last_loaded_id) {
        last_loaded_id = id;
        events_func.load_ae_obj_id__event_presentation({
            api_cfg: $ae_api,
            event_presentation_id: id,
            inc_file_li: true,
            inc_presenter_li: true,
            try_cache: true,
            log_lvl: 0
        });
    }
});

// Event File (Directly linked to presentation)
let lq__event_file_obj_li = $derived(
    liveQuery(async () => {
        if (!lq__event_presentation_obj?.event_presentation_id) return [];
        let results = await db_events.file
            .where('for_id')
            .equals(lq__event_presentation_obj.event_presentation_id)
            .reverse()
            .sortBy('created_on');
        return results;
    })
);
</script>

{#if $lq__event_file_obj_li && $lq__event_file_obj_li.length}
    <section class="event_presentation_file_list my-1">
        <div
            class="text-surface-600-400 text-[10px] font-bold tracking-wider uppercase opacity-70">
            Presentation Files:
        </div>
        <ul class="space-y-1">
            {#each $lq__event_file_obj_li as event_file_obj (event_file_obj.event_file_id)}
                <li
                    class="flex flex-col flex-wrap items-center justify-start gap-1 md:flex-row"
                    class:hidden={!launcher_loc.current
                        .show_content__hidden_files && event_file_obj.hide}>
                    <Event_launcher_file_cont
                        event_file_id={event_file_obj.event_file_id}
                        {event_file_obj}
                        hide_created_on={false}
                        hide_meta={session_type == 'poster'}
                        bind:show_internal_purpose_files={
                            launcher_loc.current.show_content__internal_files
                        }
                        show_bak_download={$ae_loc.trusted_access}
                        session_type={session_type || 'oral'}
                        open_method={session_type == 'poster' ? 'modal' : null}
                        modal_title={lq__event_presentation_obj?.name}
                        bind:modal__title={$events_sess.launcher.modal__title}
                        bind:modal__open_event_file_id={
                            $events_sess.launcher.modal__open_event_file_id
                        }
                        bind:modal__event_file_obj={
                            $events_sess.launcher.modal__event_file_obj
                        } />
                </li>
            {/each}
        </ul>
    </section>
{/if}
