mirror of
https://github.com/System-End/site.git
synced 2026-04-19 19:45:07 +00:00
790d74d3e7
* Use ESLint * oops * Ignore ESLint during builds * Disable <Image> rule * Restore quotes and apostrophes
37 lines
877 B
JavaScript
37 lines
877 B
JavaScript
import { Link, Avatar } from 'theme-ui'
|
|
import { memo, useState, useEffect } from 'react'
|
|
import { trim } from 'lodash'
|
|
|
|
const Mention = memo(function Mention({ username }) {
|
|
const [img, setImg] = useState(null)
|
|
useEffect(() => {
|
|
try {
|
|
fetch(`https://scrapbook.hackclub.com/api/profiles/${trim(username)}`)
|
|
.then(r => r.json())
|
|
.then(profile => setImg(profile.avatar))
|
|
} catch (e) {}
|
|
}, [])
|
|
return (
|
|
<Link
|
|
href={`https://scrapbook.hackclub.com/${username}`}
|
|
sx={{
|
|
display: 'inline-flex',
|
|
alignItems: 'baseline',
|
|
textDecoration: 'none'
|
|
}}
|
|
>
|
|
{img && (
|
|
<Avatar
|
|
src={img}
|
|
alt={username}
|
|
width={24}
|
|
height={24}
|
|
sx={{ mr: 1, alignSelf: 'flex-end' }}
|
|
/>
|
|
)}
|
|
@{username}
|
|
</Link>
|
|
)
|
|
})
|
|
|
|
export default Mention
|