import TextLink from '@/components/text-link';

type LegalDocumentLink = {
    key: string;
    title: string;
    href: string;
};

type LegalFooterLinksProps = {
    links: LegalDocumentLink[];
};

export function LegalFooterLinks({ links }: LegalFooterLinksProps) {
    if (links.length === 0) {
        return null;
    }

    return (
        <nav
            aria-label="Documentos legales"
            className="flex flex-wrap items-center justify-center gap-x-4 gap-y-2 text-center text-xs text-muted-foreground"
        >
            {links.map((link, index) => (
                <span key={link.key} className="inline-flex items-center gap-4">
                    {index > 0 ? (
                        <span className="text-border" aria-hidden>
                            |
                        </span>
                    ) : null}
                    <TextLink
                        href={link.href}
                        target="_blank"
                        className="text-xs"
                    >
                        {link.title}
                    </TextLink>
                </span>
            ))}
        </nav>
    );
}

export type { LegalDocumentLink };