<script lang="ts">
/** @type {import('./$types').PageData} */
let log_lvl: number = 0;

// *** Import Svelte specific
import { browser } from '$app/environment';
// import { Modal } from 'flowbite-svelte';

// *** Import other supporting libraries
import { liveQuery } from "dexie";

// *** Import Aether specific variables and functions
// import type { key_val } from '$lib/ae_stores';
// import { ae_util } from '$lib/ae_utils/ae_utils';
// import { core_func } from '$lib/ae_core/ae_core_functions';
import { db_archives } from "$lib/ae_archives/db_archives";
import { ae_snip, ae_loc, ae_sess, ae_api, ae_trig, slct, slct_trigger } from '$lib/ae_stores';
import { idaa_loc, idaa_sess, idaa_slct, idaa_trig } from '$lib/ae_idaa_stores';
// import { archives_func } from '$lib/ae_archives/ae_archives_functions';

import Comp__archive_obj_li from './ae_idaa_comp__archive_obj_li.svelte';

interface Props {
    /** @type {import('./$types').PageData} */
    data: any;
}
let { data }: Props = $props();

if (log_lvl) {
    console.log(`ae_idaa_bb +page.svelte data:`, data);
}

let lq__archive_obj_li = $derived(liveQuery(async () => {
    let results = await db_archives.archive
        .where('account_id')
        .equals($slct.account_id)
        // .orderBy('updated_on')
        // .toArray()
        .reverse()
        .sortBy('sort');
        // .sortBy('updated_on');
        // .sortBy('updated_on, created_on');
        // .sortBy('[updated_on+created_on]');
        // .sortBy('[created_on+updated_on]');

    return results;
}));

if (browser) {
    console.log('Browser environment detected.');

    // The archive_id should not already be set while the page is loading if we are looking at this page?
    // let message = {'archive_id': $idaa_slct?.archive_id ?? null};
    $idaa_slct.archive_id = null;
    let message = {'archive_id': $idaa_slct.archive_id};
    window.parent.postMessage(message, "*");
}
</script>


<svelte:head>
	<title>
        IDAA Archives:
        - Novi - {$ae_loc?.title}
    </title>
</svelte:head>


<section
    class="
        ae_idaa__bb
        container h-full mx-auto
        flex flex-col gap-1
        py-1 px-2 pb-16
        items-center
        min-w-full
        max-w-max
        "
    >

<!-- <h1>Archives {$lq__archive_obj_li?.length}</h1> -->

{#if $lq__archive_obj_li && $lq__archive_obj_li?.length}
    <Comp__archive_obj_li
        lq__archive_obj_li={lq__archive_obj_li}
        />
{:else}
    <p>No archives available to show.</p>
{/if}


</section>