<!--
     This file is part of the happyDomain (R) project.
     Copyright (c) 2022-2024 happyDomain
     Authors: Pierre-Olivier Mercier, et al.

     This program is offered under a commercial and under the AGPL license.
     For commercial licensing, contact us at <contact@happydomain.org>.

     For AGPL licensing:
     This program is free software: you can redistribute it and/or modify
     it under the terms of the GNU Affero General Public License as published by
     the Free Software Foundation, either version 3 of the License, or
     (at your option) any later version.

     This program is distributed in the hope that it will be useful,
     but WITHOUT ANY WARRANTY; without even the implied warranty of
     MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
     GNU Affero General Public License for more details.

     You should have received a copy of the GNU Affero General Public License
     along with this program.  If not, see <https://www.gnu.org/licenses/>.
-->

<script lang="ts">
    import { onMount } from "svelte";
    import "bootstrap-icons/font/bootstrap-icons.css";
    import "../app.scss";

    import Header from "$lib/components/Header.svelte";
    import Toaster from "$lib/components/Toaster.svelte";
    import VoxPeople from "$lib/components/VoxPeople.svelte";
    import { appConfig, navigate } from "$lib/stores/config";
    import { providers } from "$lib/stores/providers";
    import { toasts } from "$lib/stores/toasts";
    import { locale, t } from "$lib/translations";

    $effect(() => {
        document.documentElement.lang = $locale;
    });

    const { MODE } = import.meta.env;

    let {
        data,
        children,
    }: {
        data: {
            sw_state: { triedUpdate: boolean; hasUpdate: boolean };
        };
        children?: import("svelte").Snippet;
    } = $props();

    onMount(() => {
        window.onunhandledrejection = (e) => {
            if (e.reason.name == "NotAuthorizedError") {
                navigate("/login");
                providers.set(undefined);
                toasts.addErrorToast({
                    title: $t("errors.session.title"),
                    message: $t("errors.session.content"),
                    timeout: 10000,
                });
            } else {
                toasts.addErrorToast({
                    message: e.reason.message,
                    timeout: 30000,
                });
            }
        };
    });
</script>

{#if $appConfig.msg_header}
    <div
        class={"text-light text-center fw-semibold py-1 " +
            ($appConfig.msg_header.color ? "bg-" + $appConfig.msg_header.color : "bg-danger")}
        id="msg_header"
        style="z-index: 101"
    >
        <small>
            {$appConfig.msg_header.text}
        </small>
    </div>
{/if}
<Header sw_state={data.sw_state} />

<main class="flex-fill d-flex flex-column justify-content-center bg-light">
    {@render children?.()}
</main>

<Toaster />
{#if !$appConfig.hide_feedback && MODE == "production"}
    <VoxPeople />
{/if}
