open.source/manifold
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Add tooltip for author, close time, volume

Browse Source
This commit is contained in:
Sinclair Chen 2022-10-03 17:14:22 -07:00
parent 46023195a1
commit 29c4e79283
1 changed files with 12 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

13
web/components/contract/contract-mention.tsx
View File

@ -1,7 +1,9 @@
import clsx from 'clsx' import clsx from 'clsx'
import { Contract } from 'common/contract' import { Contract } from 'common/contract'
import { formatMoney } from 'common/util/format'
import Link from 'next/link' import Link from 'next/link'
import { contractPath, getBinaryProbPercent } from 'web/lib/firebase/contracts' import { contractPath, getBinaryProbPercent } from 'web/lib/firebase/contracts'
import { fromNow } from 'web/lib/util/time'
import { BinaryContractOutcomeLabel } from '../outcome-label' import { BinaryContractOutcomeLabel } from '../outcome-label'
import { getColor } from './quick-bet' import { getColor } from './quick-bet'
@ -14,7 +16,7 @@ export function ContractMention(props: { contract: Contract }) {
<Link href={contractPath(contract)}> <Link href={contractPath(contract)}>
<a <a
className="group inline whitespace-nowrap rounded-sm hover:bg-indigo-50 focus:bg-indigo-50" className="group inline whitespace-nowrap rounded-sm hover:bg-indigo-50 focus:bg-indigo-50"
title={outcomeType} title={tooltipLabel(contract)}
> >
<span className="break-anywhere mr-0.5 whitespace-normal font-normal text-indigo-700"> <span className="break-anywhere mr-0.5 whitespace-normal font-normal text-indigo-700">
{contract.question} {contract.question}
@ -41,3 +43,12 @@ export function ContractMention(props: { contract: Contract }) {
</Link> </Link>
) )
} }
function tooltipLabel(contract: Contract) {
const { resolutionTime, creatorName, volume, closeTime = 0 } = contract
const dateFormat = resolutionTime
? `Resolved ${fromNow(resolutionTime)}`
: `${closeTime < Date.now() ? 'Closed' : 'Closes'} ${fromNow(closeTime)}`
return `By ${creatorName}. ${formatMoney(volume)} bet. ${dateFormat}`
}