import { Entity, MegalodonInterface } from 'megalodon' import dayjs from 'dayjs' import emojify from '@/utils/emojify' import Body from '../status/Body' import Poll from '../status/Poll' import Card from '../status/Card' import Media from '../status/Media' import { FaBarsProgress, FaHouse, FaPenToSquare, FaRetweet, FaStar } from 'react-icons/fa6' import { useIntl } from 'react-intl' import { useState } from 'react' import { Avatar } from '@material-tailwind/react' import { useRouter } from 'next/router' type Props = { notification: Entity.Notification client: MegalodonInterface onRefresh: (status: Entity.Status) => void openMedia: (media: Entity.Attachment) => void } export default function Reaction(props: Props) { const status = props.notification.status const [spoilered, setSpoilered] = useState(status.spoiler_text.length > 0) const { formatMessage } = useIntl() const router = useRouter() const refresh = async () => { const res = await props.client.getStatus(status.id) props.onRefresh(res.data) } const openStatus = () => { router.push({ query: { id: router.query.id, timeline: router.query.timeline, status_id: status.id, detail: true } }) } const openUser = (id: string) => { router.push({ query: { id: router.query.id, timeline: router.query.timeline, user_id: id, detail: true } }) } return (
{actionIcon(props.notification)}
openUser(props.notification.account.id)}>
openUser(status.account.id)} variant="rounded" style={{ width: '40px', height: '40px' }} alt={formatMessage({ id: 'timeline.status.avatar' }, { user: status.account.username })} />
openUser(status.account.id)}> @{status.account.acct}
{!spoilered && ( <> {status.poll && } {status.card && } )}
) } const actionIcon = (notification: Entity.Notification) => { switch (notification.type) { case 'favourite': { return } case 'reblog': case 'quote': { return } case 'poll_expired': case 'poll_vote': { return } case 'status': { return } case 'update': { return } case 'reaction': case 'emoji_reaction': { if (notification.reaction) { if (notification.reaction.url) { return (
) } else { return (
) } } else { return null } } default: return null } } const actionId = (notification: Entity.Notification) => { switch (notification.type) { case 'favourite': return 'notification.favourite.body' case 'reblog': return 'notification.reblog.body' case 'quote': return 'notification.quote.body' case 'poll_expired': return 'notification.poll_expired.body' case 'poll_vote': return 'notification.poll.vote' case 'status': return 'notification.status.body' case 'update': return 'notification.update.body' case 'reaction': case 'emoji_reaction': return 'notification.emoji_reaction.body' default: return '' } }