import { Metadata } from "next";
import { getTranslations } from "next-intl/server";
import { HydrationBoundary, dehydrate } from "@tanstack/react-query";
import { ConfigEditor } from "@/components/dashboard/site-config/config-editor";
import { DashboardLayout } from "@/components/layout/dashboard";
import { createHelpers } from "@/lib/trpc/server";

export async function generateMetadata(): Promise<Metadata> {
    const t = await getTranslations();

    return {
        title: t("dashboard.config.title"),
        description: t("dashboard.config.description")
    };
}

export default async function Page() {
    const helpers = await createHelpers();
    const t = await getTranslations();

    await helpers.siteConfig.values.prefetch();

    return (
        <HydrationBoundary state={dehydrate(helpers.queryClient)}>
            <DashboardLayout title={t("dashboard.config.title")} description={t("dashboard.config.description")}>
                <ConfigEditor />
            </DashboardLayout>
        </HydrationBoundary>
    );
}