import { getFormatter, getLocale, getTranslations } from "next-intl/server";
import { Card } from "@/components/ui/card";
import { getPolicies } from "@/services/policyService";
import { formatPolicyDate } from "@/lib/formatPolicyDate";
import PolicyBody from "./PolicyBody";

interface PolicyContentProps {
  namespace: "RefundPolicyPage" | "PrivacyPolicyPage";
  policyKey: "refund_policy" | "privacy_policy";
}

export default async function PolicyContent({
  namespace,
  policyKey,
}: PolicyContentProps) {
  const locale = await getLocale();
  const [t, format, policies] = await Promise.all([
    getTranslations(namespace),
    getFormatter(),
    getPolicies(locale),
  ]);

  const policy = policies?.[policyKey];
  const updatedAt = formatPolicyDate(format, policy?.updated_at);

  return (
    <section className="container-padding-x my-10">
      <Card>
        <div>
          <h1 className="text-secondary-main text-[20px] md:text-[24px] font-bold">
            {t("title")}
          </h1>
          {updatedAt && (
            <h4 className="text-[14px] font-light">
              {t("lastUpdated", { date: updatedAt })}
            </h4>
          )}
        </div>
        <PolicyBody content={policy?.content} emptyText={t("unavailable")} />
      </Card>
    </section>
  );
}