import { getTranslations, getLocale } from "next-intl/server";
import { getLocaleDirection, type Locale } from "@/lib/i18n-utils";
import type { WebsiteHomePageData } from "@/lib/api/website/home-types";
import { WhoWeAreClient } from "./who-we-are-client";

type WhoWeAreProps = {
  section?: WebsiteHomePageData["sections"]["whoWeAre"];
};

export default async function WhoWeAre({ section }: WhoWeAreProps) {
  const t = await getTranslations();
  const locale = (await getLocale()) as Locale;
  const direction = getLocaleDirection(locale);

  const fallbackCards = [
    { title: t("whoWeAre.vision.title"), description: t("whoWeAre.vision.desc") },
    { title: t("whoWeAre.values.title"), description: t("whoWeAre.values.desc") },
    { title: t("whoWeAre.who.title"), description: t("whoWeAre.who.desc") },
    { title: t("whoWeAre.mission.title"), description: t("whoWeAre.mission.desc") },
  ];

  const cards = section?.cards?.length
    ? section.cards.map((c) => ({ title: c.title, description: c.description ?? "" }))
    : fallbackCards;

  return (
    <WhoWeAreClient
      badge={section?.badge ?? t("whoWeAre.badge")}
      titleHighlight={section?.titleHighlight ?? t("whoWeAre.yearHighlight")}
      titleRest={section?.title ?? t("whoWeAre.titleRest")}
      description={section?.description ?? t("whoWeAre.newDescription")}
      cards={cards}
      centerImageSrc={section?.centerImage?.src ?? "/images/who-we-are/office.jpg"}
      centerImageAlt={t("whoWeAre.centerImageAlt")}
      ctaContact={t("whoWeAre.ctaContact")}
      ctaLearnMore={t("whoWeAre.ctaLearnMore")}
      direction={direction}
    />
  );
}