import Link from "next/link";
import { brand, type Locale } from "@/content/site";
import { translations } from "@/content/translations";

export function CTASection({
  locale,
  title,
}: {
  locale: Locale;
  title?: string;
}) {
  const t = translations[locale];
  const message =
    locale === "fr"
      ? "Bonjour Yashal Studios, je souhaite commencer une conversation au sujet de mon activité."
      : locale === "ar"
        ? "مرحباً Yashal Studios، أود أن أبدأ محادثة حول نشاطي."
        : "Hello Yashal Studios, I would like to start a conversation about my business.";
  return (
    <section className="cta-section">
      <div>
        <p className="kicker">{t.common.eyebrow}</p>
        <h2>{title || t.home.finalTitle}</h2>
      </div>
      <div className="cta-actions">
        <Link className="button button-light" href={`/${locale}/contact/`}>
          {t.common.start}
        </Link>
        <a
          className="text-link light"
          href={`https://wa.me/${brand.phoneHref.replace("+", "")}?text=${encodeURIComponent(message)}`}
        >
          {t.common.whatsapp}
        </a>
      </div>
    </section>
  );
}