a0402830c5
* WIP liking markets with tip * Refactor Userlink, add MultiUserLink * Lint * Lint * Fix merge * Fix imports * wip liked contracts list * Cache likes and liked by user ids on contract * Refactor tip amount, reduce to M * Move back to M * Change positioning for large screens
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-user'
|
|
import { manaToUSD } from '../../../common/util/format'
|
|
import { RelativeTimestamp } from '../relative-timestamp'
|
|
import { UserLink } from 'web/components/user-link'
|
|
|
|
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>
|
|
)
|
|
}
|