import { getConfig } from "@/libs/axios/modules/config";
import type { Metadata } from "next";

export async function generateMetadata({
    params,
}: {
    params: Promise<{ locale: string }>;
}): Promise<Metadata> {
    const { locale } = await params;
    const isEn = locale === "en";
    const title = isEn ? "Terms of Use" : "Syarat & Ketentuan";
    const canonical = `/${locale}/terms`;

    return {
        title,
        alternates: { canonical },
    };
}

export default async function TermsPage() {
    const { data: res } = await getConfig();
    const content = res?.data?.terms_and_conditions ?? "";

    return (
        <div className="max-w-screen-md mx-auto px-4 py-12 sm:py-16">
            <h1 className="font-serif text-2xl sm:text-3xl font-bold text-kb-ink mb-8">
                Syarat &amp; Ketentuan
            </h1>
            <div
                className="prose prose-slate prose-sm sm:prose-base max-w-none
                    prose-headings:font-semibold prose-headings:text-kb-ink
                    prose-p:text-kb-muted prose-p:leading-relaxed
                    prose-li:text-kb-muted prose-strong:text-kb-ink
                    prose-a:text-primary-600"
                dangerouslySetInnerHTML={{ __html: content }}
            />
        </div>
    );
}