35 lines
759 B
TypeScript
35 lines
759 B
TypeScript
|
import Router from 'next/router'
|
||
|
import clsx from 'clsx'
|
||
|
|
||
|
export function Avatar(props: {
|
||
|
username?: string
|
||
|
avatarUrl?: string
|
||
|
noLink?: boolean
|
||
|
}) {
|
||
|
const { username, avatarUrl, noLink } = props
|
||
|
|
||
|
const onClick =
|
||
|
noLink && username
|
||
|
? undefined
|
||
|
: (e: any) => {
|
||
|
e.stopPropagation()
|
||
|
Router.push(`/${username}`)
|
||
|
}
|
||
|
return (
|
||
|
<div className="rounded-full bg-gray-400 w-10 h-10">
|
||
|
<img
|
||
|
className={clsx(
|
||
|
'rounded-full bg-gray-400 flex items-center justify-center',
|
||
|
!noLink && 'cursor-pointer',
|
||
|
!avatarUrl && 'hidden'
|
||
|
)}
|
||
|
src={avatarUrl}
|
||
|
width={40}
|
||
|
height={40}
|
||
|
onClick={onClick}
|
||
|
alt={username}
|
||
|
/>
|
||
|
</div>
|
||
|
)
|
||
|
}
|