e567782a7d
* Add tip arrows UI (visual) * move tipper into its own component * simplify score calculation * Add tip txns - more specific txn types - fix transact cloud function to be able to create tip txns - insert tips into comments via a context * Refactor tipper to send tip txns * Stop tipping yourself. Disable anons. * Style tipper (smaller) * remove default exports * capitalize tooltips * rename stuff * add exhausting hook dependencies * replace context with prop threading * fix eslint unused vars
35 lines
1.0 KiB
TypeScript
35 lines
1.0 KiB
TypeScript
import { DonationTxn } from 'common/txn'
|
|
import { Avatar } from '../avatar'
|
|
import { useUserById } from 'web/hooks/use-users'
|
|
import { UserLink } from '../user-page'
|
|
import { manaToUSD } from '../../../common/util/format'
|
|
import { RelativeTimestamp } from '../relative-timestamp'
|
|
|
|
export function Donation(props: { txn: DonationTxn }) {
|
|
const { txn } = props
|
|
const user = useUserById(txn.fromId)
|
|
|
|
if (!user) {
|
|
return <>Loading...</>
|
|
}
|
|
|
|
return (
|
|
<div className="mb-2 flow-root pr-2 md:pr-0">
|
|
<div className="relative flex items-center space-x-3">
|
|
<Avatar username={user.username} avatarUrl={user.avatarUrl} size="sm" />
|
|
<div className="min-w-0 flex-1">
|
|
<p className="mt-0.5 text-sm text-gray-500">
|
|
<UserLink
|
|
className="text-gray-500"
|
|
username={user.username}
|
|
name={user.name}
|
|
/>{' '}
|
|
donated {manaToUSD(txn.amount)}
|
|
<RelativeTimestamp time={txn.createdTime} />
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
)
|
|
}
|