---
// Importing necessary components
import MainLayout from "@/layouts/MainLayout.astro";
import PrimaryCTA from "@components/ui/buttons/PrimaryCTA.astro";
import CardSmall from "@components/ui/cards/CardSmall.astro";
import CardWide from "@components/ui/cards/CardWide.astro";
import FeaturesStatsAlt from "@components/sections/features/FeaturesStatsAlt.astro";
import TestimonialsSectionAlt from "@components/sections/testimonials/TestimonialsSectionAlt.astro";

// Importing necessary functions from Astro
import { getCollection } from "astro:content";
import type { CollectionEntry } from "astro:content";

// Fetching all the product related content and sorting it by main.id
const product: CollectionEntry<"products">[] = (
  await getCollection("products", ({ id }) => {
    return id.startsWith("fr/");
  })
).sort(
  (a: CollectionEntry<"products">, b: CollectionEntry<"products">) =>
    a.data.main.id - b.data.main.id
);

// Define variables for page content
const title: string = "Produits";
const subTitle: string =
  "Explorez la durabilité et la précision des outils ScrewFast, conçus aussi bien pour les professionnels que pour les amateurs. Chacun de nos produits est fabriqué avec précision et conçu pour durer, garantissant que vous disposez du bon outil pour chaque tâche.";

// Testimonial data that will be rendered in the component
const testimonials = [
  {
    content:
      "Depuis que nous avons adopté les outils matériels de ScrewFast, l'efficacité sur nos chantiers de construction a explosé. La durabilité des boulons hexagonaux et la précision des vis machine sont tout simplement inégalées. C'est rafraîchissant de travailler avec une entreprise qui comprend vraiment les exigences quotidiennes de l'industrie.",
    author: "Jason Clark",
    role: "Contremaître de chantier | TopBuild",
    avatarSrc:
      "https://images.unsplash.com/photo-1500648767791-00dcc994a43e?q=80&w=1374&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=facearea&facepad=2&w=320&h=320&q=80",
    avatarAlt: "Description de l'image",
  },

  {
    content:
      "En tant que designer d'intérieur, je suis toujours à la recherche de matériaux et d'outils de haute qualité qui m'aident à donner vie à mes visions. L'assortiment de vis mixtes de ScrewFast a révolutionné mes projets, offrant le mélange parfait de qualité et de variété. Le support client exceptionnel était la cerise sur le gâteau !",
    author: "Maria Gonzalez",
    role: "Designer d'intérieur | Creative Spaces",
    avatarSrc:
      "https://images.unsplash.com/photo-1544005313-94ddf0286df2?q=80&w=1376&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D8&auto=format&fit=facearea&facepad=2&w=320&h=320&q=80",
    avatarAlt: "Description de l'image",
  },

  {
    content:
      "Je suis menuisier professionnel depuis plus de 15 ans, et je peux sincèrement dire que les boulons et écrous à tarauder de ScrewFast sont parmi les meilleurs que j'ai utilisés. Ils adhèrent comme aucun autre, et j'ai une confiance totale dans chaque joint et élément. De plus, le service est impeccable - ils se soucient vraiment du succès de mon projet.",
    author: "Richard Kim",
    role: "Menuisier-Maître | WoodWright",
    avatarSrc:
      "https://images.unsplash.com/photo-1474176857210-7287d38d27c6?q=80&w=1470&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D8&auto=format&fit=facearea&facepad=2&w=320&h=320&q=80",
    avatarAlt: "Description de l'image",
  },
];
---

<MainLayout
  title="Produits | ScrewFast"
  lang="fr"
  structuredData={{
    "@context": "https://schema.org",
    "@type": "WebPage",
    "@id": "https://screwfast.uk/fr/products",
    url: "https://screwfast.uk/fr/products",
    name: "Outils Matériels | ScrewFast",
    description:
      "Explorez la durabilité et la précision des outils ScrewFast, conçus aussi bien pour les professionnels que pour les passionnés.",
    isPartOf: {
      "@type": "WebSite",
      url: "https://screwfast.uk/fr",
      name: "ScrewFast",
      description:
        "ScrewFast propose des outils matériels de premier ordre et des services de construction experts pour répondre à tous vos besoins de projet.",
    },
    inLanguage: "fr",
  }}
>
  <div
    class="mx-auto max-w-[85rem] px-4 py-10 sm:px-6 lg:px-8 lg:py-14 2xl:max-w-full"
  >
    <div class="mb-4 flex items-center justify-between gap-8 sm:mb-8 md:mb-12">
      <div class="flex items-center gap-12">
        <h1
          class="text-balance text-2xl font-bold tracking-tight text-neutral-800 dark:text-neutral-200 md:text-4xl md:leading-tight"
        >
          {title}
        </h1>
        {
          subTitle && (
            <p class="hidden max-w-screen-sm text-pretty text-neutral-600 dark:text-neutral-400 md:block">
              {subTitle}
            </p>
          )
        }
      </div>
      <PrimaryCTA
        title="Histoires de clients"
        url="#testimonials"
        noArrow={true}
      />
    </div>
    <!--Displaying products in alternating styles. Alternative product gets different card styling.-->
    <!--Maps through all product entries and displays them with either CardSmall or CardWide based on their position.-->
    <section class="grid grid-cols-1 gap-4 sm:grid-cols-3 md:gap-6 xl:gap-8">
      {
        product.map((product, index) => {
          const position = index % 4;
          if (position === 0 || position === 3) {
            return <CardSmall product={product} productLocale="fr" />;
          } else {
            return <CardWide product={product} productLocale="fr" />;
          }
        })
      }
    </section>
  </div>
  <!--Features statistics section-->
  <FeaturesStatsAlt
    title="Pourquoi choisir ScrewFast ?"
    subTitle="Transformez vos idées en résultats tangibles avec les outils ScrewFast. Que vous commenciez par un croquis sur un coin de table ou plongiez dans un projet de construction complet, nos outils sont conçus pour vous aider à construire en toute confiance."
    benefits={[
      "Outils robustes et fiables pour des performances durables.",
      "Solutions innovantes adaptées aux besoins de construction modernes.",
      "Support client dédié au succès de votre projet.",
    ]}
  />
  <!--Testimonials section-->
  <TestimonialsSectionAlt
    title="Ce que disent nos clients"
    testimonials={testimonials}
  />
</MainLayout>
