39 lines
948 B
TypeScript
39 lines
948 B
TypeScript
import { useTranslations } from 'next-intl'
|
|
import { Link } from '@/i18n/navigation'
|
|
import { TagInfo } from '@/lib/tags'
|
|
|
|
interface TagCloudProps {
|
|
tags: Array<TagInfo & { size: 'sm' | 'md' | 'lg' | 'xl' }>
|
|
}
|
|
|
|
export function TagCloud({ tags }: TagCloudProps) {
|
|
const t = useTranslations('Tags')
|
|
const sizeClasses = {
|
|
sm: 'text-xs opacity-70',
|
|
md: 'text-sm',
|
|
lg: 'text-base font-bold',
|
|
xl: 'text-lg font-bold',
|
|
}
|
|
|
|
return (
|
|
<div className="flex flex-wrap gap-4 items-baseline">
|
|
{tags.map(tag => (
|
|
<Link
|
|
key={tag.slug}
|
|
href={`/tags/${tag.slug}`}
|
|
className={`
|
|
${sizeClasses[tag.size]}
|
|
font-mono uppercase
|
|
text-zinc-400
|
|
hover:text-cyan-400
|
|
transition-colors
|
|
`}
|
|
title={t('postsWithTag', {count: tag.count, tag: tag.name})}
|
|
>
|
|
#{tag.name}
|
|
</Link>
|
|
))}
|
|
</div>
|
|
)
|
|
}
|