import { Fragment } from "react";
import Link from "next/link";
import Script from "next/script";
import {
  Breadcrumb,
  BreadcrumbItem,
  BreadcrumbLink,
  BreadcrumbList,
  BreadcrumbPage,
  BreadcrumbSeparator,
} from "@/components/ui/breadcrumb";
import { siteConfig } from "@/lib/site";

export type Crumb = { label: string; href?: string };

/**
 * Fil d'Ariane des pages de landing (secteurs / solutions / expertise) :
 * rend à la fois le fil VISIBLE (a11y, <nav aria-label="breadcrumb">) et le
 * BreadcrumbList JSON-LD (SEO). Le dernier item = page courante (sans lien) ;
 * un item intermédiaire sans `href` (ex. "Secteurs", pas de page index) est
 * rendu en texte simple.
 */
export function LandingBreadcrumb({
  items,
  scriptId,
}: {
  items: Crumb[];
  scriptId: string;
}) {
  // Un `ListItem` sans propriété `item` invalide le BreadcrumbList ENTIER au
  // regard de schema.org. Confirmé par la donnée le 2026-07-31 : l'inspection
  // d'URL GSC renvoyait `rich_results: Breadcrumbs` sur les articles (dont
  // chaque item porte une URL) et `None` sur les 10 landings.
  //
  // Les crumbs intermédiaires sans page réelle (« Secteurs », « Solutions »…)
  // ne peuvent pas porter d'URL : ces pages d'index n'existent pas. On les
  // retire donc du JSON-LD — ils restent affichés dans le fil visible — et on
  // renumérote les positions, qui doivent rester contiguës depuis 1.
  const linkedCrumbs = items.filter((it) => it.href);
  const jsonLd = {
    "@context": "https://schema.org",
    "@type": "BreadcrumbList",
    itemListElement: linkedCrumbs.map((it, i) => ({
      "@type": "ListItem",
      position: i + 1,
      name: it.label,
      item: `${siteConfig.url}${it.href}`,
    })),
  };

  return (
    <div className="mx-auto max-w-6xl px-6 pt-6">
      <Script
        id={scriptId}
        type="application/ld+json"
        dangerouslySetInnerHTML={{ __html: JSON.stringify(jsonLd) }}
      />
      <Breadcrumb>
        <BreadcrumbList>
          {items.map((it, i) => {
            const isLast = i === items.length - 1;
            return (
              <Fragment key={i}>
                <BreadcrumbItem>
                  {isLast ? (
                    <BreadcrumbPage>{it.label}</BreadcrumbPage>
                  ) : it.href ? (
                    <BreadcrumbLink asChild>
                      <Link href={it.href}>{it.label}</Link>
                    </BreadcrumbLink>
                  ) : (
                    <span>{it.label}</span>
                  )}
                </BreadcrumbItem>
                {!isLast && <BreadcrumbSeparator />}
              </Fragment>
            );
          })}
        </BreadcrumbList>
      </Breadcrumb>
    </div>
  );
}