Restrict bet panel / bet row to only CPMMBinaryContracts (all binary DPM are resolved)

This commit is contained in:
James Grugett 2022-06-14 16:32:07 -05:00
parent 0c2ab5e9d7
commit 613c4d9374
6 changed files with 42 additions and 58 deletions

View File

@ -4,7 +4,7 @@ import { partition, sumBy } from 'lodash'
import { SwitchHorizontalIcon } from '@heroicons/react/solid' import { SwitchHorizontalIcon } from '@heroicons/react/solid'
import { useUser } from 'web/hooks/use-user' import { useUser } from 'web/hooks/use-user'
import { BinaryContract, CPMMBinaryContract } from 'common/contract' import { CPMMBinaryContract } from 'common/contract'
import { Col } from './layout/col' import { Col } from './layout/col'
import { Row } from './layout/row' import { Row } from './layout/row'
import { Spacer } from './layout/spacer' import { Spacer } from './layout/spacer'
@ -42,7 +42,7 @@ import { isIOS } from 'web/lib/util/device'
import { ProbabilityInput } from './probability-input' import { ProbabilityInput } from './probability-input'
export function BetPanel(props: { export function BetPanel(props: {
contract: BinaryContract contract: CPMMBinaryContract
className?: string className?: string
}) { }) {
const { contract, className } = props const { contract, className } = props
@ -91,7 +91,7 @@ export function BetPanel(props: {
} }
export function BetPanelSwitcher(props: { export function BetPanelSwitcher(props: {
contract: BinaryContract contract: CPMMBinaryContract
className?: string className?: string
title?: string // Set if BetPanel is on a feed modal title?: string // Set if BetPanel is on a feed modal
selected?: 'YES' | 'NO' selected?: 'YES' | 'NO'
@ -170,19 +170,16 @@ export function BetPanelSwitcher(props: {
text={tradeType === 'BUY' ? title ?? 'Place a trade' : 'Sell shares'} text={tradeType === 'BUY' ? title ?? 'Place a trade' : 'Sell shares'}
/> />
{tradeType === 'SELL' && {tradeType === 'SELL' && user && sharesOutcome && (
mechanism == 'cpmm-1' && <SellPanel
user && contract={contract}
sharesOutcome && ( shares={yesShares || noShares}
<SellPanel sharesOutcome={sharesOutcome}
contract={contract} user={user}
shares={yesShares || noShares} userBets={userBets ?? []}
sharesOutcome={sharesOutcome} onSellSuccess={onBetSuccess}
user={user} />
userBets={userBets ?? []} )}
onSellSuccess={onBetSuccess}
/>
)}
{tradeType === 'BUY' && ( {tradeType === 'BUY' && (
<BuyPanel <BuyPanel
@ -200,7 +197,7 @@ export function BetPanelSwitcher(props: {
} }
function BuyPanel(props: { function BuyPanel(props: {
contract: BinaryContract contract: CPMMBinaryContract
user: User | null | undefined user: User | null | undefined
isLimitOrder?: boolean isLimitOrder?: boolean
selected?: 'YES' | 'NO' selected?: 'YES' | 'NO'
@ -293,20 +290,12 @@ function BuyPanel(props: {
const currentReturn = betAmount ? (currentPayout - betAmount) / betAmount : 0 const currentReturn = betAmount ? (currentPayout - betAmount) / betAmount : 0
const currentReturnPercent = formatPercent(currentReturn) const currentReturnPercent = formatPercent(currentReturn)
const cpmmFees = const cpmmFees = getCpmmLiquidityFee(
contract.mechanism === 'cpmm-1' && contract,
getCpmmLiquidityFee(contract, betAmount ?? 0, betChoice ?? 'YES').totalFees betAmount ?? 0,
betChoice ?? 'YES'
).totalFees
const dpmTooltip =
contract.mechanism === 'dpm-2'
? `Current payout for ${formatWithCommas(shares)} / ${formatWithCommas(
shares +
contract.totalShares[betChoice ?? 'YES'] -
(contract.phantomShares
? contract.phantomShares[betChoice ?? 'YES']
: 0)
)} ${betChoice ?? 'YES'} shares`
: undefined
return ( return (
<> <>
<YesNoSelector <YesNoSelector
@ -355,24 +344,9 @@ function BuyPanel(props: {
<Row className="items-center justify-between gap-2 text-sm"> <Row className="items-center justify-between gap-2 text-sm">
<Row className="flex-nowrap items-center gap-2 whitespace-nowrap text-gray-500"> <Row className="flex-nowrap items-center gap-2 whitespace-nowrap text-gray-500">
<div> <div>
{contract.mechanism === 'dpm-2' ? ( Payout if <BinaryOutcomeLabel outcome={betChoice ?? 'YES'} />
<>
Estimated
<br /> payout if{' '}
<BinaryOutcomeLabel outcome={betChoice ?? 'YES'} />
</>
) : (
<>
Payout if <BinaryOutcomeLabel outcome={betChoice ?? 'YES'} />
</>
)}
</div> </div>
<InfoTooltip text={`Includes ${formatMoney(cpmmFees)} in fees`} />
{cpmmFees !== false && (
<InfoTooltip text={`Includes ${formatMoney(cpmmFees)} in fees`} />
)}
{dpmTooltip && <InfoTooltip text={dpmTooltip} />}
</Row> </Row>
<div> <div>
<span className="mr-2 whitespace-nowrap"> <span className="mr-2 whitespace-nowrap">

View File

@ -3,7 +3,7 @@ import clsx from 'clsx'
import { BetPanelSwitcher } from './bet-panel' import { BetPanelSwitcher } from './bet-panel'
import { YesNoSelector } from './yes-no-selector' import { YesNoSelector } from './yes-no-selector'
import { BinaryContract } from 'common/contract' import { CPMMBinaryContract } from 'common/contract'
import { Modal } from './layout/modal' import { Modal } from './layout/modal'
import { SellButton } from './sell-button' import { SellButton } from './sell-button'
import { useUser } from 'web/hooks/use-user' import { useUser } from 'web/hooks/use-user'
@ -12,7 +12,7 @@ import { useSaveShares } from './use-save-shares'
// Inline version of a bet panel. Opens BetPanel in a new modal. // Inline version of a bet panel. Opens BetPanel in a new modal.
export default function BetRow(props: { export default function BetRow(props: {
contract: BinaryContract contract: CPMMBinaryContract
className?: string className?: string
btnClassName?: string btnClassName?: string
betPanelClassName?: string betPanelClassName?: string

View File

@ -16,7 +16,7 @@ import { Bet } from 'common/bet'
import { Comment } from 'common/comment' import { Comment } from 'common/comment'
import BetRow from '../bet-row' import BetRow from '../bet-row'
import { AnswersGraph } from '../answers/answers-graph' import { AnswersGraph } from '../answers/answers-graph'
import { Contract } from 'common/contract' import { Contract, CPMMBinaryContract } from 'common/contract'
import { ContractDescription } from './contract-description' import { ContractDescription } from './contract-description'
import { ContractDetails } from './contract-details' import { ContractDetails } from './contract-details'
import { ShareMarket } from '../share-market' import { ShareMarket } from '../share-market'
@ -63,7 +63,9 @@ export const ContractOverview = (props: {
<Row className="items-center justify-between gap-4 xl:hidden"> <Row className="items-center justify-between gap-4 xl:hidden">
<BinaryResolutionOrChance contract={contract} /> <BinaryResolutionOrChance contract={contract} />
{tradingAllowed(contract) && <BetRow contract={contract} />} {tradingAllowed(contract) && (
<BetRow contract={contract as CPMMBinaryContract} />
)}
</Row> </Row>
) : ( ) : (
outcomeType === 'FREE_RESPONSE' && outcomeType === 'FREE_RESPONSE' &&

View File

@ -35,7 +35,7 @@ import {
TruncatedComment, TruncatedComment,
} from 'web/components/feed/feed-comments' } from 'web/components/feed/feed-comments'
import { FeedBet, FeedBetGroup } from 'web/components/feed/feed-bets' import { FeedBet, FeedBetGroup } from 'web/components/feed/feed-bets'
import { NumericContract } from 'common/contract' import { CPMMBinaryContract, NumericContract } from 'common/contract'
export function FeedItems(props: { export function FeedItems(props: {
contract: Contract contract: Contract
@ -68,7 +68,10 @@ export function FeedItems(props: {
))} ))}
</div> </div>
{outcomeType === 'BINARY' && tradingAllowed(contract) && ( {outcomeType === 'BINARY' && tradingAllowed(contract) && (
<BetRow contract={contract} className={clsx('mb-2', betRowClassName)} /> <BetRow
contract={contract as CPMMBinaryContract}
className={clsx('mb-2', betRowClassName)}
/>
)} )}
</div> </div>
) )

View File

@ -39,6 +39,7 @@ import { FeedBet } from 'web/components/feed/feed-bets'
import { useIsIframe } from 'web/hooks/use-is-iframe' import { useIsIframe } from 'web/hooks/use-is-iframe'
import ContractEmbedPage from '../embed/[username]/[contractSlug]' import ContractEmbedPage from '../embed/[username]/[contractSlug]'
import { useBets } from 'web/hooks/use-bets' import { useBets } from 'web/hooks/use-bets'
import { CPMMBinaryContract } from 'common/contract'
export const getStaticProps = fromPropz(getStaticPropz) export const getStaticProps = fromPropz(getStaticPropz)
export async function getStaticPropz(props: { export async function getStaticPropz(props: {
@ -142,7 +143,10 @@ export function ContractPageContent(
(isNumeric ? ( (isNumeric ? (
<NumericBetPanel className="hidden xl:flex" contract={contract} /> <NumericBetPanel className="hidden xl:flex" contract={contract} />
) : ( ) : (
<BetPanel className="hidden xl:flex" contract={contract} /> <BetPanel
className="hidden xl:flex"
contract={contract as CPMMBinaryContract}
/>
))} ))}
{allowResolve && {allowResolve &&
(isNumeric ? ( (isNumeric ? (

View File

@ -1,5 +1,5 @@
import { Bet } from 'common/bet' import { Bet } from 'common/bet'
import { Contract } from 'common/contract' import { Contract, CPMMBinaryContract } 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 BetRow from 'web/components/bet-row'
@ -110,9 +110,10 @@ function ContractEmbed(props: { contract: Contract; bets: Bet[] }) {
{isBinary && ( {isBinary && (
<Row className="items-center gap-4"> <Row className="items-center gap-4">
{/* this fails typechecking, but it doesn't explode because we will <BetRow
never */} contract={contract as CPMMBinaryContract}
<BetRow contract={contract as any} betPanelClassName="scale-75" /> betPanelClassName="scale-75"
/>
<BinaryResolutionOrChance contract={contract} /> <BinaryResolutionOrChance contract={contract} />
</Row> </Row>
)} )}