import { getLocationSection } from "@/lib/api/location";
import { HeroLocationImage, HeroLocationContent } from "./components";
import {
  BreadcrumbItem,
  CustomBreadcrumb,
} from "@/components/shared/CustomBreadcrumb";
import { getTranslations } from "next-intl/server";

export default async function HeroLocationSection() {
  const breadcrumbT = await getTranslations("Breadcrumb");
  const locationSection = await getLocationSection();
  const locationImage = locationSection?.image;
  const locationContent = locationSection?.content;
  const locationTitle = locationSection?.title;
  const breadcrumbItems: BreadcrumbItem[] = [
    { label: breadcrumbT("home"), href: "/" },
    { label: breadcrumbT("location"), isCurrentPage: true },
  ];

  return (
    <section className="flex flex-col gap-5 md:gap-10">
      <CustomBreadcrumb items={breadcrumbItems} />
      <div className="grid grid-cols-1 lg:grid-cols-2 gap-5 sm:gap-10 lg:gap-20 w-full">
        <HeroLocationImage
          image={locationImage || null}
          title={locationTitle || null}
        />
        <HeroLocationContent
          content={locationContent || null}
          title={locationTitle || null}
        />
      </div>
    </section>
  );
}