---
import type { CollectionEntry } from 'astro:content';

type Link = CollectionEntry<'projects'>['data']['links'][number];

interface Props {
  links: Link[];
}

const { links } = Astro.props;

function isExternal(url: string) {
  return /^https?:\/\//.test(url);
}
---

{
  links.length > 0 && (
    <ul class="project-links">
      {links.map((link) => (
        <li>
          <a
            href={link.url}
            download={link.download ? '' : undefined}
            rel={isExternal(link.url) ? 'noopener noreferrer' : undefined}
            target={isExternal(link.url) ? '_blank' : undefined}
          >
            {link.label}
            {isExternal(link.url) && (
              <>
                <svg
                  class="external-link-icon"
                  xmlns="http://www.w3.org/2000/svg"
                  width="0.85em"
                  height="0.85em"
                  viewBox="0 0 24 24"
                  fill="none"
                  stroke="currentColor"
                  stroke-width="2"
                  stroke-linecap="round"
                  stroke-linejoin="round"
                  aria-hidden="true"
                >
                  <path d="M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6" />
                  <polyline points="15 3 21 3 21 9" />
                  <line x1="10" y1="14" x2="21" y2="3" />
                </svg>
                <span class="sr-only">(opens in new tab)</span>
              </>
            )}
            {link.download && (
              <>
                <span class="download-indicator" aria-hidden="true">
                  ↓
                </span>
                <span class="sr-only">(download)</span>
              </>
            )}
          </a>
        </li>
      ))}
    </ul>
  )
}