import { useTranslation } from "next-i18next";
import { serverSideTranslations } from "next-i18next/serverSideTranslations";
import Layout from "../components/layout";
import { legal as legalEs } from "../../public/locales/es/legal";
import { legal as legalEn } from "../../public/locales/en/legal";

const LegalPage = ({ currentLegal }) => {
  const { t: translate } = useTranslation();

  return (
    <Layout title={translate("footer.legal", "Legal Notice")}>
      <div className="layout py-10">
        <h2 className="font-inter font-bold text-2xl py-2">
          {translate("footer.legal", "Legal Notice")}
        </h2>
        <p className="whitespace-pre-line">{currentLegal}</p>
      </div>
    </Layout>
  );
};

export async function getStaticProps({ locale }) {
  const legal = locale === "es" ? legalEs : legalEn;

  return {
    props: {
      currentLegal: legal,
      ...(await serverSideTranslations(locale)),
    },
  };
}

export default LegalPage;
