<script lang="ts">
/** @type {import('./$types').LayoutData} */

let log_lvl: number = 1;

// Imports
// *** Import Svelte specific
import { browser } from '$app/environment';
// *** Import other supporting libraries
import { AppShell, AppBar, initializeStores } from '@skeletonlabs/skeleton';
import { Modal } from '@skeletonlabs/skeleton';
import type {
    ModalComponent
    } from '@skeletonlabs/skeleton';


import { ae_snip, ae_loc, ae_sess, ae_api, ae_trig, slct, slct_trigger } from '$lib/ae_stores';
import { core_func } from '$lib/ae_core/ae_core_functions';
import { idaa_loc, idaa_sess, idaa_slct } from '$lib/ae_idaa_stores';
import Element_data_store from '$lib/element_data_store_v2.svelte';

const modalRegistry: Record<string, ModalComponent> = {
	// Set a unique modal ID, then pass the component reference
	// modalComponentEditSponsorshipObj: { ref: ModalComponentEditSponsorshipObj },
	// modalComponentTwo: { ref: ModalComponentTwo },
	// ...
};

let { data, children }: Props = $props();


function add_activity_log(
        {
            action = 'idaa_root_layout',
        }: {
            action?: string,
        }
    ) {

    let last_cache_refresh_iso = new Date($ae_loc?.last_cache_refresh);

    let data_kv = {
        external_client_id: data?.route.id,
        name: `IDAA: ${$idaa_loc.novi_full_name ?? 'no-name'} ${$idaa_loc.novi_email ?? 'no-email'} allow=${$ae_loc?.allow_access}`,
        object_type: 'idaa', // archive, post, event
        // object_id_random: data?.route,
        url_root: data?.url.origin,
        // url_full_path: data?.url.href,
        url_full_path: data?.url.pathname,
        url_params: data?.url.searchParams.toString(),
        action: action,
        meta_json: {
            allow_access: $ae_loc?.allow_access,
            last_cache_refresh: $ae_loc?.last_cache_refresh,
            last_cache_refresh_iso: last_cache_refresh_iso.toISOString(),
            last_cache_refresh_locale: last_cache_refresh_iso.toLocaleString(),
            access_level: $ae_loc?.access_level,
            iframe: $ae_loc?.iframe,
            // site_access_key: $ae_loc?.site_access_key,
            // site_domain_access_key: $ae_loc?.site_domain_access_key,
            // site_domain: $ae_loc?.site_domain,
            // extra_data: extra_data ?? '',
            // log_lvl: log_lvl,
        }
    };

    core_func.create_ae_obj__activity_log({
        api_cfg: $ae_api,
        account_id: $ae_loc.account_id,
        data_kv: data_kv,
        log_lvl: log_lvl
    });
}

if (browser) {
    add_activity_log(
        {
            action: 'idaa_root_layout - browser',
        }
    );
}

</script>

<svelte:head>
	<title>IDAA - {$idaa_loc?.title ?? 'Æ loading...'}</title>
</svelte:head>

<Modal components={modalRegistry}
    regionBackdrop=''
    regionBody=''
    regionHeader='modal-header card-header text-2xl font-bold'
    regionFooter='modal-footer flex justify-between space-x-2'
    />

<!-- App Shell -->
<AppShell
    regionPage={($ae_loc?.iframe ? 'iframe' : '')}
    slotHeader={($ae_loc?.iframe ? 'iframe' : '')}
    slotFooter={($ae_loc?.iframe ? 'iframe' : '')}
    >

    {#snippet header()}

            <!-- App Bar -->
            <AppBar
                gridColumns="grid-cols-3"
                slotDefault="place-self-center"
                slotTrail="place-content-end"
                padding="px-4"
                >
                {#snippet lead()}

                        <Element_data_store
                            ds_code="hub__page__appshell_header_lead"
                            ds_type="html"
                            />


                            {/snippet}
                <!-- OSIT's Aether App -->
                <!-- {@html (browser ? JSON.parse(localStorage.getItem('ae_ds__hub__site__appshell_header')).html : '-- not found --')} -->
                <!-- {@html $ae_sess.site_appshell_header} -->
                <Element_data_store
                    ds_code="hub__site__appshell_header"
                    ds_type="html"
                    />
                {#snippet trail()}

                        <Element_data_store
                            ds_code="hub__page__appshell_header_trail"
                            ds_type="html"
                            />

                            {/snippet}
            </AppBar>


            {/snippet}


    <!-- !($ae_loc.site_access_key && $ae_loc.site_domain_access_key)
    || ($ae_loc.site_access_key == access_key || $ae_loc.site_domain_access_key == access_key)} -->


        <!-- {$ae_loc?.site_access_key ?? '-- site access key not set --'} -->
        <!-- {$ae_loc?.site_domain_access_key ?? '-- site domain access key not set --'} -->
        <!-- {access_key ?? '-- param key not set --'} -->

        <!-- Page Route Content -->
        {@render children?.()}



    {#snippet footer()}

        <div
            class="flex text-sm sm:text-sm md:text-md lg:text-md xl:text-md 2xl:text-lg text-slate-400 hover:text-slate-800 transition px-1"
            class:ae_debug={$ae_loc?.debug}
            >

            <Element_data_store
                ds_code="hub__site__appshell_footer"
                ds_type="html"
                class_li="grow flex flex-row justify-between"
                />

        </div>

    {/snippet}


</AppShell>
