Ahmed Al-Taiar
25 lines
741 B
TypeScript
25 lines
741 B
TypeScript
import { FindSocials } from 'types/graphql'
|
|
|
|
import { baseUrls, getLogoComponent, sortOrder } from 'src/lib/handle'
|
|
|
|
const SocialLinks = ({ socials }: FindSocials) => (
|
|
<div className={`grid max-w-68 grid-cols-[repeat(auto-fit,3rem)] gap-2`}>
|
|
{[...socials]
|
|
.sort((a, b) => sortOrder.indexOf(a.type) - sortOrder.indexOf(b.type))
|
|
.map((social, i) => (
|
|
<div key={i} className="tooltip" data-tip={social.name}>
|
|
<a
|
|
className="btn btn-square"
|
|
href={`${baseUrls[social.type]}${social.username}`}
|
|
target="_blank"
|
|
rel="noreferrer"
|
|
>
|
|
{getLogoComponent(social.type)}
|
|
</a>
|
|
</div>
|
|
))}
|
|
</div>
|
|
)
|
|
|
|
export default SocialLinks
|