'use server';
import { FC, Suspense } from "react";
import { AuthLayoutProps } from "@/validations/mutual/auth/props";
import LanguageSelectionComponent from "@/components/mutual/languageSelection/component";

const AuthLayout: FC<AuthLayoutProps> = async ({ lang, page, activePageUrl }) => {
    return (
        <div className="min-h-screen min-w-screen flex h-screen w-screen overflow-hidden">
            <div className="w-1/4">
                <div className="flex flex-col items-center justify-center h-screen bg-purple-600">
                    <div className="text-2xl font-bold">WAG Frontend</div>
                    <div className="text-sm text-gray-500 mt-4">Welcome to the WAG Frontend Application</div>
                </div>
            </div>
            <div className="w-3/4 text-black">
                <LanguageSelectionComponent lang={lang} activePage={activePageUrl} prefix={"/auth"} />
                <Suspense fallback={<div>Loading...</div>}>{page}</Suspense>
            </div>
        </div>
    );
}

export { AuthLayout };