'use server';
import { FC } from "react";
import { langDynamicPagesGet, langGet } from "@/lib/langGet";
import { DashboardLayoutProps, ModeTypes } from "@/validations/mutual/dashboard/props";
import { dynamicPagesIndex } from "@/languages/custom";

import HeaderComponent from "@/components/custom/header/component";
import MenuComponent from "@/components/custom/menu/single/component";
import ContentComponent from "@/components/custom/content/component";
import FooterComponent from "@/components/custom/footer/component";
import { menuTranslation } from "@/languages/mutual/menu";

const menuTranslations = {
    en: {
        "dashboard": "Dashboard",
        "application": "Application",
        "services": "Services",
    },
    tr: {
        "dashboard": "Panel",
        "application": "Uygulama",
        "services": "Servisler",
    },
}

const menuUrlIndex = {
    dashboard: "/dashboard",
    application: "/application",
    services: "/services",
}

const DashboardLayout: FC<DashboardLayoutProps> = async ({ params, searchParams, lang }) => {
    const activePageUrl = `${params?.page?.join("/")}`;
    const mode = (searchParams?.mode as ModeTypes) || 'shortList';
    const translations = langGet(lang, langDynamicPagesGet(activePageUrl, dynamicPagesIndex));
    const headerProps = { translations: translations.header, lang, activePageUrl, prefix: "/panel" }
    const menuProps = { lang, activePageUrl, translations: menuTranslations[lang], menuItems: menuUrlIndex, prefix: "/panel" }
    const contentProps = { translations: translations.content, lang, activePageUrl, mode, isMulti: false }

    return (
        <div className="flex flex-col min-w-screen">
            <HeaderComponent {...headerProps} />
            <MenuComponent {...menuProps} />
            <ContentComponent {...contentProps} />
            <FooterComponent translations={translations.footer} />
        </div>
    );
}

export { DashboardLayout };