---

import Contenido_2025_Montevideo from "./Contenido_2025_Montevideo.astro";
import { extractImageUrl, PAGE_ENTITY_ID } from '../../lib/functions.js';

interface MontevideoItem {
    link?: string;
    image?: string;
    altImage?: string;
    title?: string;
    fecha?: string;         // etiqueta de fecha para mostrar (badge)
    author?: string;
    authorUrl?: string;
    authorType?: 'Person' | 'Organization'; // tipo schema.org del autor en el JSON-LD
    description?: string;
    datePublished?: string; // ISO 8601, para JSON-LD
    dateModified?: string;  // ISO 8601, para JSON-LD (última modificación)
    keywords?: string;      // keywords reales, para JSON-LD y para etiqueta visual
}

const {
    items = [],
    etiquetaVisible = "fecha",
    showAutor = false,
    }: { items?: MontevideoItem[]; etiquetaVisible?: "fecha" | "keywords"; showAutor?: boolean } = Astro.props;

// isPartOf hacia el nodo de página (#webpage por defecto). Genérico: opt-out con pageId="".
// itemListId opcional: si se pasa, el ItemList lleva ese @id (para ser mainEntity de la CollectionPage).
const { pageId = PAGE_ENTITY_ID, itemListId = '' } = Astro.props;

const escapeJson = (s = "") => String(s).replace(/<[^>]*>/g, '').replace(/\\/g, '\\\\').replace(/"/g, '\\"').replace(/</g, '\\u003c').replace(/>/g, '\\u003e').replace(/[\n\r\t]+/g, ' ');

const structuredData = `<script type="application/ld+json">
{
    "@context": "https://schema.org",
    "@type": "ItemList",${itemListId ? `
    "@id": "${itemListId}",` : ''}${pageId ? `
    "isPartOf": { "@id": "${pageId}" },` : ''}
    "numberOfItems": ${items.length},
    "itemListElement": [${items.map((item: MontevideoItem, i: number) => `{
        "@type": "ListItem",
        "position": ${i + 1},
        "item": {
            "@type": "BlogPosting",
            "headline": "${escapeJson(item.title)}",
            "description": "${escapeJson(item.description)}"${item.image ? `,
            "image": "${escapeJson(extractImageUrl(item.image))}"` : ""}${item.link ? `,
            "url": "${escapeJson(item.link)}"` : ""}${item.author ? `,
            "author": { "@type": "${item.authorType === 'Organization' ? 'Organization' : 'Person'}", "name": "${escapeJson(item.author)}", "url": "${escapeJson(item.authorUrl)}" }` : ""}${item.datePublished ? `,
            "datePublished": "${escapeJson(item.datePublished)}"` : ""}${item.dateModified ? `,
            "dateModified": "${escapeJson(item.dateModified)}"` : ""}${item.keywords ? `,
            "keywords": "${escapeJson(item.keywords)}"` : ""}
        }
    }`).join(',')}]
}
</script>`;

---
<div class="w-full flex flex-row flex-wrap items-center justify-center mt-4 md:mt-0 mb-4">
    <div class="max-w-7xl w-full gap-8 px-8 md:px-0 grid grid-cols-1 md:grid-cols-[repeat(2,minmax(0,400px))] lg:grid-cols-[repeat(3,minmax(0,400px))] justify-center mb-0">
        {items.map((item: MontevideoItem) => (
            <Contenido_2025_Montevideo
                link={item.link}
                image={item.image}
                altImage={item.altImage}
                title={item.title}
                tag={etiquetaVisible === "keywords" ? item.keywords : item.fecha}
                author={showAutor ? item.author : ''}
                description={item.description} />

        ))}
    </div>
</div>

<Fragment set:html={structuredData} />