2022-03-17 02:25:39 +00:00
|
|
|
import { Contract, tradingAllowed } from '../lib/firebase/contracts'
|
2021-12-10 14:56:17 +00:00
|
|
|
import { Col } from './layout/col'
|
|
|
|
import { Spacer } from './layout/spacer'
|
2021-12-12 22:14:52 +00:00
|
|
|
import { ContractProbGraph } from './contract-prob-graph'
|
2021-12-14 18:51:30 +00:00
|
|
|
import { useUser } from '../hooks/use-user'
|
2021-12-16 10:46:41 +00:00
|
|
|
import { Row } from './layout/row'
|
2021-12-19 09:24:37 +00:00
|
|
|
import { Linkify } from './linkify'
|
2021-12-20 05:15:18 +00:00
|
|
|
import clsx from 'clsx'
|
2022-01-02 20:53:42 +00:00
|
|
|
import { ContractDetails, ResolutionOrChance } from './contract-card'
|
2022-01-15 00:16:25 +00:00
|
|
|
import { Bet } from '../../common/bet'
|
|
|
|
import { Comment } from '../../common/comment'
|
2022-02-02 21:29:26 +00:00
|
|
|
import { RevealableTagsInput, TagsInput } from './tags-input'
|
2022-01-26 22:44:32 +00:00
|
|
|
import BetRow from './bet-row'
|
2022-02-01 18:06:42 +00:00
|
|
|
import { Fold } from '../../common/fold'
|
|
|
|
import { FoldTagList } from './tags-list'
|
2022-03-14 20:29:32 +00:00
|
|
|
import { ContractActivity } from './feed/contract-activity'
|
2022-03-15 19:42:04 +00:00
|
|
|
import { AnswersGraph } from './answers/answers-graph'
|
2022-03-15 22:27:51 +00:00
|
|
|
import { DPM, FreeResponse, FullContract } from '../../common/contract'
|
2021-12-16 10:46:41 +00:00
|
|
|
|
2021-12-12 22:14:52 +00:00
|
|
|
export const ContractOverview = (props: {
|
|
|
|
contract: Contract
|
2022-01-15 00:16:25 +00:00
|
|
|
bets: Bet[]
|
|
|
|
comments: Comment[]
|
2022-02-01 18:06:42 +00:00
|
|
|
folds: Fold[]
|
2022-02-17 23:00:19 +00:00
|
|
|
children?: any
|
2021-12-12 22:14:52 +00:00
|
|
|
className?: string
|
|
|
|
}) => {
|
2022-02-17 23:00:19 +00:00
|
|
|
const { contract, bets, comments, folds, children, className } = props
|
|
|
|
const { question, resolution, creatorId, outcomeType } = contract
|
2021-12-10 14:56:17 +00:00
|
|
|
|
2021-12-14 18:51:30 +00:00
|
|
|
const user = useUser()
|
|
|
|
const isCreator = user?.id === creatorId
|
2022-02-17 23:00:19 +00:00
|
|
|
const isBinary = outcomeType === 'BINARY'
|
2021-12-14 18:51:30 +00:00
|
|
|
|
2021-12-10 14:56:17 +00:00
|
|
|
return (
|
2021-12-20 05:15:18 +00:00
|
|
|
<Col className={clsx('mb-6', className)}>
|
2022-01-13 18:58:25 +00:00
|
|
|
<Row className="justify-between gap-4 px-2">
|
2022-01-02 19:09:01 +00:00
|
|
|
<Col className="gap-4">
|
2022-02-11 18:40:22 +00:00
|
|
|
<div className="text-2xl text-indigo-700 md:text-3xl">
|
2022-02-17 23:00:19 +00:00
|
|
|
<Linkify text={question} />
|
2021-12-14 10:23:32 +00:00
|
|
|
</div>
|
|
|
|
|
2022-02-11 18:40:22 +00:00
|
|
|
<Row className="items-center justify-between gap-4">
|
2022-02-17 23:00:19 +00:00
|
|
|
{(isBinary || resolution) && (
|
|
|
|
<ResolutionOrChance
|
|
|
|
className="md:hidden"
|
|
|
|
contract={contract}
|
|
|
|
large
|
|
|
|
/>
|
|
|
|
)}
|
2022-01-26 22:44:32 +00:00
|
|
|
|
2022-02-17 23:00:19 +00:00
|
|
|
{isBinary && tradingAllowed(contract) && (
|
2022-01-30 03:08:06 +00:00
|
|
|
<BetRow
|
|
|
|
contract={contract}
|
|
|
|
className="md:hidden"
|
|
|
|
labelClassName="hidden"
|
|
|
|
/>
|
|
|
|
)}
|
2022-01-26 22:44:32 +00:00
|
|
|
</Row>
|
2022-01-02 19:09:01 +00:00
|
|
|
|
2022-02-23 03:38:53 +00:00
|
|
|
<ContractDetails contract={contract} isCreator={isCreator} />
|
2021-12-12 22:51:44 +00:00
|
|
|
</Col>
|
|
|
|
|
2022-02-17 23:00:19 +00:00
|
|
|
{(isBinary || resolution) && (
|
|
|
|
<Col className="hidden items-end justify-between md:flex">
|
|
|
|
<ResolutionOrChance
|
|
|
|
className="items-end"
|
|
|
|
contract={contract}
|
|
|
|
large
|
|
|
|
/>
|
|
|
|
</Col>
|
|
|
|
)}
|
2022-01-02 19:09:01 +00:00
|
|
|
</Row>
|
2021-12-10 14:56:17 +00:00
|
|
|
|
|
|
|
<Spacer h={4} />
|
|
|
|
|
2022-03-15 19:42:04 +00:00
|
|
|
{isBinary ? (
|
|
|
|
<ContractProbGraph contract={contract} bets={bets} />
|
|
|
|
) : (
|
2022-03-15 22:27:51 +00:00
|
|
|
<AnswersGraph
|
|
|
|
contract={contract as FullContract<DPM, FreeResponse>}
|
|
|
|
bets={bets}
|
|
|
|
/>
|
2022-03-15 19:42:04 +00:00
|
|
|
)}
|
2021-12-10 14:56:17 +00:00
|
|
|
|
2022-02-17 23:00:19 +00:00
|
|
|
{children}
|
|
|
|
|
|
|
|
<Row className="mt-6 hidden items-center justify-between gap-4 sm:flex">
|
2022-02-02 21:29:26 +00:00
|
|
|
{folds.length === 0 ? (
|
|
|
|
<TagsInput className={clsx('mx-4')} contract={contract} />
|
|
|
|
) : (
|
|
|
|
<FoldTagList folds={folds} />
|
|
|
|
)}
|
2022-01-26 23:45:05 +00:00
|
|
|
</Row>
|
|
|
|
|
2022-02-17 23:00:19 +00:00
|
|
|
<Col className="mt-6 gap-4 sm:hidden">
|
2022-02-02 21:29:26 +00:00
|
|
|
{folds.length === 0 ? (
|
|
|
|
<TagsInput contract={contract} />
|
|
|
|
) : (
|
|
|
|
<FoldTagList folds={folds} />
|
|
|
|
)}
|
2022-02-01 18:06:42 +00:00
|
|
|
</Col>
|
|
|
|
|
2022-02-02 21:29:26 +00:00
|
|
|
{folds.length > 0 && (
|
2022-02-17 23:00:19 +00:00
|
|
|
<RevealableTagsInput className="mt-4" contract={contract} />
|
2022-02-02 21:29:26 +00:00
|
|
|
)}
|
2022-02-01 18:06:42 +00:00
|
|
|
|
2022-02-17 23:00:19 +00:00
|
|
|
<Spacer h={12} />
|
|
|
|
|
2022-03-14 20:29:32 +00:00
|
|
|
<ContractActivity
|
2022-01-15 00:16:25 +00:00
|
|
|
contract={contract}
|
|
|
|
bets={bets}
|
|
|
|
comments={comments}
|
2022-03-14 20:29:32 +00:00
|
|
|
user={user}
|
|
|
|
mode="all"
|
2022-02-18 01:56:03 +00:00
|
|
|
betRowClassName="!mt-0"
|
2022-01-15 00:16:25 +00:00
|
|
|
/>
|
2021-12-10 14:56:17 +00:00
|
|
|
</Col>
|
|
|
|
)
|
|
|
|
}
|