import SectionTitle from "@/components/shared/SectionTitle/Index";
import { ValuesGrid } from "./components";
import { useTranslations } from "next-intl";
import {
  BreadcrumbItem,
  CustomBreadcrumb,
} from "@/components/shared/CustomBreadcrumb";

export default function OurStrategyAndValuesSection() {
  const t = useTranslations("AboutPage.strategyAndValues");
  const breadcrumbT = useTranslations("Breadcrumb");
  const breadcrumbItems: BreadcrumbItem[] = [
    { label: breadcrumbT("home"), href: "/" },
    { label: breadcrumbT("about"), isCurrentPage: true },
  ];

  return (
    <section className="our-strategy-and-values-section">
      <CustomBreadcrumb items={breadcrumbItems} />
      <SectionTitle title={t("title")} />
      <ValuesGrid />
    </section>
  );
}