import theme from "@/core/utils/theme";
import useLanguage from "@/lib/app/hooks/useLanguage";
import useLoading from "@/lib/app/hooks/useLoading";
import useUser from "@/lib/app/hooks/useUser";
import Head from "next/head";
import NextNProgress from "nextjs-progressbar";
import {useEffect} from "react";
import {ToastContainer} from "react-toastify";
import useDirection from "@/lib/app/hooks/useDirection";
import "react-toastify/dist/ReactToastify.css";

function AppLayout({children, isBot}) {
    const {languageIsReady} = useLanguage();
    const {setLoadingPage} = useLoading();
    const {userChangedLanguage, token, isAuth} = useUser();
    const {directionApp} = useDirection();

    useEffect(() => {
        if (languageIsReady) {
            if (token) {
                if (isAuth) {
                    if (userChangedLanguage) {
                        setLoadingPage(true);
                        return;
                    }
                    setLoadingPage(false);
                    return;
                }
                setLoadingPage(true);
                return;
            }
            setLoadingPage(false);
            return;
        }
        setLoadingPage(true);
    }, [languageIsReady, token, isAuth, userChangedLanguage]);

    if (!isBot) {
        if (userChangedLanguage) return;
        if (!languageIsReady) return;
    }

    return (
        <>
            <Head>
                <meta
                    name="application-name"
                    content={process.env.NEXT_PUBLIC_API_NAME}
                />
                <meta name="apple-mobile-web-app-capable" content="yes"/>
                <meta
                    name="apple-mobile-web-app-status-bar-style"
                    content="black-translucent"
                />
                <meta
                    name="apple-mobile-web-app-title"
                    content={process.env.NEXT_PUBLIC_API_NAME}
                />
                <meta name="description" content="Marhaba does it for you"/>
                <meta name="format-detection" content="telephone=no"/>
                <meta name="format-detection" content="date=no"/>
                <meta name="format-detection" content="address=no"/>
                <meta name="format-detection" content="email=no"/>
                <meta name="mobile-web-app-capable" content="yes"/>
                <link rel="apple-touch-icon" href="/icons/maskable_icon_x512.png"/>
                <link
                    rel="apple-touch-icon"
                    sizes="120x120"
                    href="/icons/maskable_icon_x128.png"
                />
                <link
                    rel="apple-touch-icon"
                    sizes="180x180"
                    href="/icons/maskable_icon_x192.png"
                />
                <meta name="google" content="notranslate"/>
                <meta name="robots" content="noindex"/>
                <meta
                    name="viewport"
                    content="minimum-scale=1, initial-scale=1, width=device-width, shrink-to-fit=no, user-scalable=no, viewport-fit=cover"
                />
                <link
                    rel="icon"
                    type="image/svg"
                    sizes="32x32"
                    href="/images/logo.png"
                />
                <link
                    rel="icon"
                    type="image/svg"
                    sizes="16x16"
                    href="/images/logo.png"
                />
            </Head>
            <NextNProgress
                color={theme.palette.secondary.dark}
                options={{showSpinner: false}}
            />
            <ToastContainer position={directionApp === "ltr" ? "top-left" : "top-right"} rtl={directionApp === 'rtl'}/>
            {children}
        </>
    );
}

export default AppLayout;
