<svelte:options immutable={true}/>
<svelte:window bind:online={online}/>

<script lang="ts">
    import {Locales} from "$app/lib/i18n/i18n-types";
    import {logout_user} from "$app/lib/services/user-service";
    import {currentLocale, preffered_or_default} from "$shared/lib/locale";
    import {CookieNames} from "$shared/lib/configuration";
    import {get_cookie} from "$shared/lib/helpers";
    import {Temporal} from "@js-temporal/polyfill";
    import {onMount} from "svelte";
    import Router from "svelte-spa-router";
    import {wrap} from "svelte-spa-router/wrap";
    import {QueryClient, QueryClientProvider} from "@sveltestack/svelte-query";
    import {is_active} from "$shared/lib/session";
    import UiWorkbench from "$app/pages/ui-workbench.svelte";
    import NotFound from "$app/pages/not-found.svelte";
    import Home from "$app/pages/home.svelte";
    import Settings from "$app/pages/settings.svelte";
    import Data from "$app/pages/data.svelte";
    import PreHeader from "$shared/components/pre-header.svelte";
    import {setLocale} from "$app/lib/i18n/i18n-svelte";
    import {loadLocaleAsync} from "$app/lib/i18n/i18n-util.async";
    import {i18nObject} from "$app/lib/i18n/i18n-util";

    let online = true;
    let notOnlineText;
    let LL;

    console.log("Projects Startup Report", {
        prefferedLocale: navigator.language,
        timeZone: Temporal.Now.timeZone().id,
        themeCookie: {name: CookieNames.theme, value: get_cookie(CookieNames.theme)},
        localeCookie: {name: CookieNames.locale, value: get_cookie(CookieNames.locale)},
        prefersColorScheme: window.matchMedia("(prefers-color-scheme: dark)").matches ? "dark" : "light"
    });

    currentLocale.subscribe(async locale => {
        locale = (locale === "preffered" ? preffered_or_default() : locale);
        await loadLocaleAsync(locale as Locales);
        LL = i18nObject(locale as Locales);
        setLocale(locale as Locales);
    });

    onMount(async () => {
        const locale = $currentLocale === "preffered" ? preffered_or_default() : $currentLocale;
        await loadLocaleAsync(locale as Locales);
        LL = i18nObject(locale as Locales);
        setLocale(locale as Locales);
        notOnlineText = LL.messages.noInternet();
    });

    async function user_is_logged_in() {
        if (!await is_active()) {
            await logout_user("expired");
        }
        return true;
    }

    const queryClient = new QueryClient();

    const routes = {
        "/home": wrap({
            component: Home,
            conditions: [user_is_logged_in],
        }),
        "/": wrap({
            component: Home,
            conditions: [user_is_logged_in],
        }),
        "/settings": wrap({
            component: Settings,
            conditions: [user_is_logged_in],
        }),
        "/data": wrap({
            component: Data,
            conditions: [user_is_logged_in],
        }),
        "/ui-workbench": UiWorkbench,
        "*": NotFound,
    };
</script>

<PreHeader show="{!online}">{notOnlineText}</PreHeader>

<QueryClientProvider client={queryClient}>
    <Router
            {routes}
            restoreScrollState={true}
            on:routeLoading={() => {
            document.getElementById("loader").style.display = "inline-block";
        }}
            on:routeLoaded={() => {
            document.getElementById("loader").style.display = "none";
        }}
    />
</QueryClientProvider>
