Files
web/components/Footer/Navigation/SecondaryNav/index.tsx
2024-09-04 08:50:12 +02:00

70 lines
2.2 KiB
TypeScript

import Image from "@/components/Image"
import Link from "@/components/TempDesignSystem/Link"
import Body from "@/components/TempDesignSystem/Text/Body"
import styles from "./secondarynav.module.css"
import {
AppDownLoadLinks,
type FooterSecondaryNavProps,
} from "@/types/components/footer/navigation"
export default function FooterSecondaryNav({
secondaryLinks,
appDownloads,
}: FooterSecondaryNavProps) {
console.log("secondaryLinks", secondaryLinks[0].links)
return (
<div className={styles.secondaryNavigation}>
<nav className={styles.secondaryNavigationGroup}>
<Body color="peach80" textTransform="uppercase">
{appDownloads.title}
</Body>
<ul className={styles.secondaryNavigationList}>
{appDownloads.links.map((link) => (
<li key={link.id} className={styles.appDownloadItem}>
<a href={link.href} target="_blank" aria-label={link.title}>
<Image
src={
AppDownLoadLinks[link.type as keyof typeof AppDownLoadLinks]
}
alt={link.href.title}
width={125}
height={40}
/>
</a>
</li>
))}
</ul>
</nav>
{secondaryLinks.map((link) => (
<nav className={styles.secondaryNavigationGroup} key={link.title}>
<Body color="peach80" textTransform="uppercase">
{link.title}
</Body>
<ul className={styles.secondaryNavigationList}>
{link.links.map((link) => (
<li key={link.id} className={styles.secondaryNavigationItem}>
{link.isExternal ? (
<a
href={link.href}
key={link.title}
target={link.openInNewTab ? "_blank" : "_self"}
aria-label={link.title}
>
{link.title}
</a>
) : (
<Link href={link.href} key={link.title}>
{link.title}
</Link>
)}
</li>
))}
</ul>
</nav>
))}
</div>
)
}