---
const {
  listing
} = Astro.props

const hasRelatedLinks = Array.isArray(listing.relatedLinks)
---
{ hasRelatedLinks && listing.relatedLinks.map( (link, i) => {

    const notAppTestLink = !link.label.includes('🧪')

    const isMainLink = (i === 0) && notAppTestLink

    return (
        <a
            class="relative inline-flex items-center rounded-md px-4 py-2 leading-5 font-bold text-white border border-transparent focus:outline-none focus:border-indigo-600 neumorphic-shadow focus:shadow-outline-indigo bg-darker hover:bg-indigo-400 active:bg-indigo-600 transition duration-150 ease-in-out"
            href={ link.href }
            target="_blank"
            rel="noopener"
            role="button"
        >{ isMainLink ? 'View' : link.label }</a>
    )
} ) }