import { Link } from "@/i18n/navigation";
import { getTranslations } from "next-intl/server";
import FooterSocial from "./FooterSocial";

export default async function Footer() {
  const t = await getTranslations("footer");
  const th = await getTranslations("header");

  const pageLinks = [
    { label: th("home"), href: "/" as const },
    { label: th("tech"), href: "/tech" as const },
    { label: th("solutions"), href: "/solutions" as const },
    { label: th("about"), href: "/about" as const },
  ];

  const businessLinks = [
    { label: t("bizDeSpace"), href: "#" as const },
    { label: t("bizRWA"), href: "#" as const },
    { label: t("bizQuant"), href: "#" as const },
  ];

  return (
    <footer className="footer">
      <div className="footer-main">
        <div className="footer-brand">
          {/* eslint-disable-next-line @next/next/no-img-element */}
          <img
            src="/logo-footer.png"
            alt="DESUN SINGULARITY"
            width={160}
            height={46}
            className="footer-logo-img"
          />
          <p className="footer-tagline">{t("tagline")}</p>
          <div className="footer-contact">
            <span className="footer-contact-label">{t("contactLabel")}</span>
            <FooterSocial />
          </div>
        </div>

        <div className="footer-links">
          <div className="footer-col">
            <span className="footer-col-title">{t("pagesTitle")}</span>
            {pageLinks.map((link) => (
              <Link key={link.href} href={link.href} className="footer-link">
                {link.label}
              </Link>
            ))}
          </div>
          <div className="footer-col">
            <span className="footer-col-title">{t("businessTitle")}</span>
            {businessLinks.map((link) => (
              <a key={link.label} href={link.href} className="footer-link">
                {link.label}
              </a>
            ))}
          </div>
        </div>
      </div>

      <div className="footer-divider" />

      <div className="footer-bottom">
        <span className="footer-copyright">{t("copyright")}</span>
      </div>
    </footer>
  );
}