<script lang="ts">
// NEW NEW NEW: 2025-01-07
import { liveQuery } from 'dexie';

import type { key_val } from '$lib/stores/ae_stores';
// import { ae_util } from '$lib/ae_utils/ae_utils';
// import { api } from '$lib/api';
// import Element_data_store from '$lib/element_data_store.svelte';
import Element_manage_hosted_file_li from '$lib/elements/element_manage_hosted_file_li.svelte';

// import { core_func } from '$lib/ae_core_functions';
// import { ae_loc, ae_sess, ae_api, ae_trig, slct, slct_trigger } from '$lib/ae_stores';
import { db_core } from '$lib/ae_core/db_core';
// import { events_loc, events_sess, events_slct, events_trigger } from '$lib/stores/ae_events_stores';

interface Props {
    // import { events_func } from '$lib/ae_events/ae_events_functions';
    class_li_default?: string; // |Array<string>;
    class_li?: string; // |Array<string>;
    link_to_type: string;
    link_to_id: string;
    allow_basic?: boolean; // Not used yet
    allow_moderator?: boolean; // Not used yet
    display_mode?: string; // 'default', 'compact', 'minimal', 'launcher'
    max_file_count?: number;
    file_type?: string; // 'image', 'video', 'audio', 'document', 'other'
    slct_hosted_file_kv?: key_val;
    slct_hosted_file_id?: any;
    slct_hosted_file_obj?: any;
}

let {
    class_li_default,
    class_li,
    link_to_type,
    link_to_id,
    allow_basic = false,
    allow_moderator = false,
    display_mode = 'default',
    max_file_count = $bindable(49),
    file_type = $bindable('all'),
    slct_hosted_file_kv = $bindable({}),
    slct_hosted_file_id = $bindable(null),
    slct_hosted_file_obj = $bindable(null)
}: Props = $props();

$effect(() => {
    console.log(
        `HERE HERE HERE HERE: link_to_type: ${link_to_type} link_to_id: ${link_to_id}`
    );
});

// export let show_convert_btn: null|boolean = null;

// let ae_placeholder_li: key_val = {};
// let ae_promises: key_val = {};
let ae_tmp: key_val = {};
ae_tmp.show__file_li = true;
ae_tmp.show__direct_download = false;
// let ae_triggers: key_val = {};

let dq__where_val = $derived(`${link_to_type}_id`); // no more _random ???
let dq__where_eq_val = $derived(link_to_id);

// This should include all files that are associated with an object (event, location, session, presenter, etc.)
// I am not sure why, but doing reverse() and then sortBy() seems to sort in descending order.
let lq__hosted_file_obj_li = $derived(
    liveQuery(async () => {
        // console.log(`dq__where_val: ${dq__where_val}`);
        // console.log(`dq__where_eq_val: ${dq__where_eq_val}`);
        let results = null;
        if (file_type == 'all' || !file_type) {
            results = await db_core.file
                .where(dq__where_val)
                .equals(dq__where_eq_val)
                .sortBy('created_on');
        } else if (file_type == 'video') {
            // Handle video/mp4, video/mov, video/webm. If the content type is prefixed with "video/", then it is a video file.
            let extension = 'mp4';
            results = await db_core.file
                .where(dq__where_val)
                .equals(dq__where_eq_val)
                // .and((x) => (x.extension == extension))
                // .and((x) => (x.content_type == `video/${extension}`))
                .and((x) => x.content_type?.startsWith('video/') === true)
                // .reverse()
                .sortBy('created_on');
            // .toArray()
        } else if (file_type == 'audio') {
            // Handle audio/mp3, audio/wav, audio/ogg. If the content type is prefixed with "audio/", then it is an audio file.
            results = await db_core.file
                .where(dq__where_val)
                .equals(dq__where_eq_val)
                .and((x) => x.content_type?.startsWith('audio/') === true)
                .sortBy('created_on');
        } else if (file_type == 'image') {
            // Handle image/jpeg, image/png, image/gif. If the content type is prefixed with "image/", then it is an image file.
            results = await db_core.file
                .where(dq__where_val)
                .equals(dq__where_eq_val)
                .and((x) => x.content_type?.startsWith('image/') === true)
                .sortBy('created_on');
        } else if (file_type == 'document') {
            // Handle application/pdf, application/msword, application/vnd.openxmlformats-officedocument.wordprocessingml.document, application/vnd.ms-excel, application/vnd.openxmlformats-officedocument.spreadsheetml.sheet, application/vnd.ms-powerpoint, application/vnd.openxmlformats-officedocument.presentationml.presentation. If the content type is prefixed with "application/", then it is a document file.
            results = await db_core.file
                .where(dq__where_val)
                .equals(dq__where_eq_val)
                .and((x) => x.content_type?.startsWith('application/') === true)
                .sortBy('created_on');
        } else {
            results = await db_core.file
                .where(dq__where_val)
                .equals(dq__where_eq_val)
                // .reverse()
                .sortBy('created_on');
        }

        return results;
    })
);
</script>

{#if lq__hosted_file_obj_li}
    <Element_manage_hosted_file_li
        {link_to_type}
        {link_to_id}
        {lq__hosted_file_obj_li}
        {class_li_default}
        {class_li}
        {display_mode}
        bind:max_file_count
        bind:file_type
        bind:slct_hosted_file_kv
        bind:slct_hosted_file_id
        bind:slct_hosted_file_obj />
    <!-- allow_basic={allow_basic} -->
    <!-- allow_moderator={allow_moderator} -->
{:else}
    <p>No files found</p>
{/if}
