<script lang="ts">
/** @type {import('./$types').PageData} */
export let data: any;
// console.log(`ae_root +page data:`, data);

import { onMount } from 'svelte';

import {
    Brain,
    House,
    Library,
    RefreshCw, RefreshCcwDot,
    Satellite
} from '@lucide/svelte';

// import { PUBLIC_TESTING } from '$env/static/public';
// console.log(`AE Config - +page.svelte PUBLIC_TESTING:`, PUBLIC_TESTING);

import Element_data_store from '$lib/element_data_store_v2.svelte';

// import { api } from '$lib/api';
import { ae_loc, ae_sess, ae_api, slct, slct_trigger } from '$lib/ae_stores';
// import type { key_val } from '$lib/ae_stores';
// console.log($ae_loc, $ae_sess, $ae_api);


onMount(() => {
    console.log(`Root: +page.svelte; URL: ${data.url}`);
});
</script>


<section
    class="ae_root md:container h-full mx-auto flex flex-col items-center p-4 space-y-12"
    class:ae_root--auth_access={$ae_loc.auth_access}
    class:ae_root--public_access={$ae_loc.public_access}
    class:ae_root--trusted_access={$ae_loc.trusted_access}
    class:ae_root--administrator_access={$ae_loc.administrator_access}
    class:ae_root--manager_access={$ae_loc.manager_access}
    class:ae_root--super_access={$ae_loc.super_access}
    >

<Element_data_store
    ds_code="hub__site__root_page_header"
    ds_type="html"
    for_type={null}
    for_id={null}
    ds_name="Default: AE Hub - Site root page header HTML"
    class_li={$ae_sess.ds_loaded.hub__site__root_page_header === false ? 'hidden' : ''}
    bind:ds_loaded={$ae_sess.ds_loaded.hub__site__root_page_header}
    />
<!-- page header DS: {$ae_sess.ds_loaded.hub__site__root_page_header} -->

<Element_data_store
    ds_code="hub__site__root_page_content"
    ds_type="html"
    for_type={null}
    for_id={null}
    ds_name="Default: AE Hub - Site root page content HTML"
    show_edit={false}
    class_li={$ae_sess.ds_loaded.hub__site__root_page_content === false ? 'hidden' : 'grow'}
    bind:ds_loaded={$ae_sess.ds_loaded.hub__site__root_page_content}
    />
<!-- page content DS: {$ae_sess.ds_loaded.hub__site__root_page_content} -->

<section class="flex flex-col gap-2 items-center p-4 space-y-6">

    <div
        data-sveltekit-preload-data="false"
        class="flex flex-row flex-wrap items-center justify-center"
        >
        <button
            type="button"
            on:click={() => {
                window.location.reload(true);
            }}
            class="btn btn-sm m-1 preset-tonal-surface hover:variant-outline-warning text-error-300 hover:text-error-800 transition-all"
            title="Reload page to clear some caches and check for updates"
            >
            <!-- <span class="fas fa-sync mx-1"></span> -->
            <RefreshCw class="mx-1" />
            Reload
        </button>
        <button
            type="button"
            on:click={() => {
                if (!confirm('Are you sure you want to clear IndexedDB databases, localStorage, and sessionStorage? This will also reload the page.')) {
                    return;
                }
                // Clear Indexed DB
                indexedDB.deleteDatabase('ae_archives_db'); // Archives module
                indexedDB.deleteDatabase('ae_core_db');
                indexedDB.deleteDatabase('ae_events_db'); // Events module
                indexedDB.deleteDatabase('ae_journals_db'); // Journals module
                indexedDB.deleteDatabase('ae_posts_db'); // Posts module
                indexedDB.deleteDatabase('ae_sponsorships_db'); // Sponsorships module

                localStorage.clear();
                sessionStorage.clear();

                alert('Local and Session Storage cleared. The page should now refresh on its own.');
                window.location.reload(true);
            }}
            class="btn btn-sm m-1 p-1 preset-tonal-surface hover:variant-outline-warning text-error-300 hover:text-error-800 transition-all"
            title="Clear IDB, localStorage, and sessionStorage and then reload to clear the page cache"
            >
            <!-- <span class="fas fa-sync mx-1"></span> -->
            <RefreshCcwDot class="mx-1" />
            Clear Storage and Reload
        </button>
    </div>

    <Element_data_store
        expire_minutes={2}
        ds_code="hub__site__root_page_footer"
        ds_type="html"
        for_type={null}
        for_id={null}
        ds_name="Default: AE Hub - Site root page footer HTML"
        display="block"
        class_li={!$ae_loc.manager_access && $ae_sess.ds_loaded.hub__site__root_page_footer === false ? 'hidden' : ''}
        bind:ds_loaded={$ae_sess.ds_loaded.hub__site__root_page_footer}
        />
    <!-- page footer DS: {$ae_sess.ds_loaded.hub__site__root_page_footer} -->


    <ol class="list-decimal hidden">
    <li>Placeholder for Tailwind</li>
    </ol>

</section>

</section>


<style lang="postcss">
</style>
