Move icon components to design-system * Move icon components to design-system Approved-by: Hrishikesh Vaipurkar
34 lines
936 B
TypeScript
34 lines
936 B
TypeScript
"use client"
|
|
|
|
import { IconByIconName } from "@scandic-hotels/design-system/Icons/IconByIconName"
|
|
|
|
import { trackSocialMediaClick } from "@/utils/tracking"
|
|
|
|
import type { IconName } from "@scandic-hotels/design-system/Icons/iconName"
|
|
|
|
import type { SocialIconsProps } from "@/types/components/footer/socialIcons"
|
|
import type { SocialLinkProps } from "@/types/components/footer/socialLink"
|
|
|
|
function SocialIcon({ iconName }: SocialIconsProps) {
|
|
const SocialIcon = (
|
|
<IconByIconName iconName={iconName} color="Icon/Inverted" />
|
|
)
|
|
return SocialIcon ? SocialIcon : <span>{iconName}</span>
|
|
}
|
|
|
|
export default function SocialLink({ link }: SocialLinkProps) {
|
|
const { href, title } = link
|
|
return (
|
|
<a
|
|
color="white"
|
|
href={href}
|
|
key={title}
|
|
target="_blank"
|
|
aria-label={title}
|
|
onClick={() => trackSocialMediaClick(title)}
|
|
>
|
|
<SocialIcon iconName={title as IconName} />
|
|
</a>
|
|
)
|
|
}
|