---
import { Icon } from "astro-icon/components";
import { techLinks } from "../config/data";

// Helper function to check if icon is a string (Astro icon)
function isAstroIcon(icon: any): icon is string {
    return typeof icon === "string";
}
---

<div class="flex flex-row gap-4 text-3xl flex-wrap justify-center">
    {
        techLinks.map((link) => {
            if (isAstroIcon(link.icon)) {
                return (
                    <a
                        href={link.url}
                        target="_blank"
                        rel="noopener noreferrer"
                        aria-label={link.ariaLabel}
                        class="hover:text-primary transition-colors"
                    >
                        <Icon name={link.icon} />
                    </a>
                );
            }
            return null;
        })
    }
</div>