diff --git a/web/components/contract/contract-card.tsx b/web/components/contract/contract-card.tsx index bf53f0c4..f1da5956 100644 --- a/web/components/contract/contract-card.tsx +++ b/web/components/contract/contract-card.tsx @@ -21,6 +21,7 @@ import { Spacer } from '../layout/spacer' import { useState } from 'react' import { getProbability } from '../../../common/calculate' import { ContractInfoDialog } from './contract-info-dialog' +import { Bet } from '../../../common/bet' export function ContractCard(props: { contract: Contract @@ -171,10 +172,11 @@ function AbbrContractDetails(props: { export function ContractDetails(props: { contract: Contract + bets: Bet[] isCreator?: boolean hideShareButtons?: boolean }) { - const { contract, isCreator, hideShareButtons } = props + const { contract, bets, isCreator, hideShareButtons } = props const { closeTime, creatorName, creatorUsername } = contract const { volumeLabel, createdDate, resolvedDate } = contractMetrics(contract) @@ -233,7 +235,9 @@ export function ContractDetails(props: {
{volumeLabel}
- {!hideShareButtons && } + {!hideShareButtons && ( + + )} ) diff --git a/web/components/contract/contract-info-dialog.tsx b/web/components/contract/contract-info-dialog.tsx index 3d552550..cc01ec2a 100644 --- a/web/components/contract/contract-info-dialog.tsx +++ b/web/components/contract/contract-info-dialog.tsx @@ -3,6 +3,7 @@ import clsx from 'clsx' import dayjs from 'dayjs' import _ from 'lodash' import { useState } from 'react' +import { Bet } from '../../../common/bet' import { Contract } from '../../../common/contract' import { formatMoney } from '../../../common/util/format' @@ -22,8 +23,8 @@ import { FoldTagList } from '../tags-list' import { Title } from '../title' import { TweetButton } from '../tweet-button' -export function ContractInfoDialog(props: { contract: Contract }) { - const { contract } = props +export function ContractInfoDialog(props: { contract: Contract; bets: Bet[] }) { + const { contract, bets } = props const [open, setOpen] = useState(false) @@ -36,6 +37,7 @@ export function ContractInfoDialog(props: { contract: Contract }) { const formatTime = (dt: number) => dayjs(dt).format('MMM DD, YYYY hh:mm a z') const { createdTime, closeTime, resolutionTime } = contract + const tradersCount = _.uniqBy(bets, 'userId').length return ( <> @@ -82,6 +84,11 @@ export function ContractInfoDialog(props: { contract: Contract }) { {formatMoney(contract.volume)} + + Traders + {tradersCount} + + {contract.mechanism === 'cpmm-1' && ( Liquidity diff --git a/web/components/contract/contract-overview.tsx b/web/components/contract/contract-overview.tsx index 5537e240..198b3c0c 100644 --- a/web/components/contract/contract-overview.tsx +++ b/web/components/contract/contract-overview.tsx @@ -56,7 +56,11 @@ export const ContractOverview = (props: { )} - + diff --git a/web/pages/embed/[username]/[contractSlug].tsx b/web/pages/embed/[username]/[contractSlug].tsx index 58b03dc1..1da6cdf2 100644 --- a/web/pages/embed/[username]/[contractSlug].tsx +++ b/web/pages/embed/[username]/[contractSlug].tsx @@ -113,6 +113,7 @@ function ContractEmbed(props: { contract: Contract; bets: Bet[] }) {