---
// biome-ignore-all lint/correctness/noUnusedVariables: Astro template consumes frontmatter values.
import { formatCompact, getImagePulls, getStarCount } from "@/lib/stats";

// Fetched at build time; refreshed by the scheduled landing rebuild.
const starCount = await getStarCount();
const { display: pullsDisplay } = await getImagePulls();

const stats = [
  {
    value: "200+",
    label: "Processing Tools",
    sublabel: "Across 5 file modalities",
  },
  {
    value: formatCompact(starCount),
    label: "GitHub Stars",
    sublabel: "Open-source & growing",
  },
  {
    value: pullsDisplay,
    label: "Image Pulls",
    sublabel: "Deployed worldwide",
  },
  {
    value: "20+",
    label: "Languages",
    sublabel: "Speaks your language",
  },
];
---

<div class="relative mx-auto mt-6 max-w-5xl">

    <!-- Stats grid -->
    <div class="reveal grid grid-cols-2 gap-10 sm:gap-12 lg:grid-cols-4">
      {stats.map((stat) => {
        const inner = (
          <div class="text-center">
            <p class="font-display text-5xl font-extrabold tracking-tight text-primary md:text-6xl">
              {stat.value}
            </p>
            <p class="mt-2 text-sm font-semibold text-foreground">{stat.label}</p>
            <p class="mt-0.5 text-xs text-muted">{stat.sublabel}</p>
          </div>
        );

        return <div class="p-3">{inner}</div>;
      })}
    </div>

</div>