OSIT-AE-App-Svelte/src/routes/+page.svelte

<script lang="ts">
    // 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/elements/element_data_store.svelte';

    // import { api } from '$lib/api';
    import { ae_loc, ae_sess, ae_api, slct, slct_trigger } from '$lib/stores/ae_stores';
    interface Props {
        /** @type {import('./$types').PageData} */
        data: any;
    }

    let { data }: Props = $props();
    // 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>

<svelte:head>
    <title>{$ae_loc.title ?? 'Æ loading...'}</title>
</svelte:head>

<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_loc.manager_access && $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_loc.manager_access && $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"
                onclick={() => {
                    window.location.reload();
                }}
                class="btn btn-sm m-1 preset-tonal-surface hover:preset-outlined-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"
                onclick={() => {
                    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();
                }}
                class="btn btn-sm m-1 p-1 preset-tonal-surface hover:preset-outlined-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>