Add bet buttons to embed

- Make only title link to market
- Prevent avatar / username from being clicked on
This commit is contained in:
Sinclair Chen 2022-05-12 17:16:07 -04:00
parent e0d266887c
commit b53de2239c
2 changed files with 29 additions and 19 deletions

View File

@ -70,9 +70,9 @@ export function ContractDetails(props: {
contract: Contract contract: Contract
bets: Bet[] bets: Bet[]
isCreator?: boolean isCreator?: boolean
hideShareButtons?: boolean disabled?: boolean
}) { }) {
const { contract, bets, isCreator, hideShareButtons } = props const { contract, bets, isCreator, disabled } = props
const { closeTime, creatorName, creatorUsername } = contract const { closeTime, creatorName, creatorUsername } = contract
const { volumeLabel, createdDate, resolvedDate } = contractMetrics(contract) const { volumeLabel, createdDate, resolvedDate } = contractMetrics(contract)
@ -83,13 +83,18 @@ export function ContractDetails(props: {
<Avatar <Avatar
username={creatorUsername} username={creatorUsername}
avatarUrl={contract.creatorAvatarUrl} avatarUrl={contract.creatorAvatarUrl}
noLink={disabled}
size={6} size={6}
/> />
<UserLink {disabled ? (
className="whitespace-nowrap" creatorName
name={creatorName} ) : (
username={creatorUsername} <UserLink
/> className="whitespace-nowrap"
name={creatorName}
username={creatorUsername}
/>
)}
</Row> </Row>
{(!!closeTime || !!resolvedDate) && ( {(!!closeTime || !!resolvedDate) && (
@ -131,9 +136,7 @@ export function ContractDetails(props: {
<div className="whitespace-nowrap">{volumeLabel}</div> <div className="whitespace-nowrap">{volumeLabel}</div>
</Row> </Row>
{!hideShareButtons && ( {!disabled && <ContractInfoDialog contract={contract} bets={bets} />}
<ContractInfoDialog contract={contract} bets={bets} />
)}
</Row> </Row>
</Col> </Col>
) )

View File

@ -1,7 +1,14 @@
import { Bet } from 'common/bet' import { Bet } from 'common/bet'
import { Contract, DPM, FreeResponse, FullContract } from 'common/contract' import {
BinaryContract,
Contract,
DPM,
FreeResponse,
FullContract,
} from 'common/contract'
import { DOMAIN } from 'common/envs/constants' import { DOMAIN } from 'common/envs/constants'
import { AnswersGraph } from 'web/components/answers/answers-graph' import { AnswersGraph } from 'web/components/answers/answers-graph'
import BetRow from 'web/components/bet-row'
import { import {
BinaryResolutionOrChance, BinaryResolutionOrChance,
FreeResponseResolutionOrChance, FreeResponseResolutionOrChance,
@ -92,13 +99,8 @@ function ContractEmbed(props: { contract: Contract; bets: Bet[] }) {
return ( return (
<Col className="w-full flex-1 bg-white"> <Col className="w-full flex-1 bg-white">
<div className="relative flex flex-col pt-2" ref={setElem}> <div className="relative flex flex-col pt-2" ref={setElem}>
<SiteLink
className="absolute top-0 left-0 z-20 h-full w-full"
href={href}
/>
<div className="px-3 text-xl text-indigo-700 md:text-2xl"> <div className="px-3 text-xl text-indigo-700 md:text-2xl">
<Linkify text={question} /> <SiteLink href={href}>{question}</SiteLink>
</div> </div>
<Spacer h={3} /> <Spacer h={3} />
@ -108,10 +110,15 @@ function ContractEmbed(props: { contract: Contract; bets: Bet[] }) {
contract={contract} contract={contract}
bets={bets} bets={bets}
isCreator={false} isCreator={false}
hideShareButtons disabled
/> />
{isBinary && <BinaryResolutionOrChance contract={contract} />} {isBinary && (
<Row className="items-center gap-4">
<BetRow contract={contract as BinaryContract} />
<BinaryResolutionOrChance contract={contract} />
</Row>
)}
{outcomeType === 'FREE_RESPONSE' && resolution && ( {outcomeType === 'FREE_RESPONSE' && resolution && (
<FreeResponseResolutionOrChance <FreeResponseResolutionOrChance