import Container from "@/components/reusableComponent/Container"
import SectionTitle from "@/components/sectionTitle/SectionTitle"
import { getTermsData } from "@/lib/serverActions"
import { getTranslations } from "next-intl/server"

// export async function generateMetadata({ params }: any): Promise<Metadata> {
//   const t = await getTranslations("meta");
//   return {
//     title: t("terms.title"),
//     description: t("terms.description"),
//     keywords: [
//       t("terms.terms_of_service"),
//       t("terms.website_terms"),
//       t("terms.R&H_terms"),
//       t("terms.conditions_of_use"),
//     ],
//   };
// }

export default async function Page({ params }: any) {
    const { locale } = await params
    const t = await getTranslations("terms")

    const data = await getTermsData(locale)
 
    return (
        <Container className="!pt-[48px] flex flex-col !gap-12 !px-11 mb-[120px]">
            {/* <Banner img={data?.data?.header?.image?.original_url} title={t("title")} description={data?.data?.header?.text} /> */}
            {/* <Banner
        img={data?.data?.header?.image?.original_url || pic1}
        title={t("title")}
        description={data?.data?.header?.description}
      />
      <div className="mt-[100px]">
        <p>{data?.data?.data?.text}</p>
        <p className="mt-5">{data?.data?.data?.info}</p>
      </div> */}
            <SectionTitle
                title={data?.data?.headers?.["terms-conditions-page"]?.locales?.name}
                description={data?.data?.headers?.["terms-conditions-page"]?.locales?.description}
            />
            <div className="flex flex-col">
                <span className="text-dark md:text-[15px]  xl:text-[40px] lg:text-[30px]  font-light">
                    {data?.data?.data?.["terms-conditions"]?.locales?.name}
                </span>
                {/* <p className="text-[20px] font-extralight text-dark">
        {data?.data?.data?.["terms-conditions"]?.locales?.description}
        </p> */}

                <p
                    className="text-[14px] lg:text-[20px] md:text-[15px] font-extralight text-dark"
                    dangerouslySetInnerHTML={{
                        __html: data?.data?.data?.["terms-conditions"]?.locales?.description,
                    }}
                />
            </div>
        </Container>
    )
}