Revert "Yes and no buttons on contract page (#868)"
This reverts commit b39e0f304f.
This commit is contained in:
mantikoros
parent
18815caed4
commit
93033b5b24
|
|
@ -32,17 +32,6 @@ export default function BetButton(props: {
|
|||
return (
|
||||
<>
|
||||
<Col className={clsx('items-center', className)}>
|
||||
{user && (
|
||||
<div className={'mb-1 w-24 text-center text-sm text-gray-500'}>
|
||||
{hasYesShares
|
||||
? `(${Math.floor(yesShares)} ${
|
||||
isPseudoNumeric ? 'HIGHER' : 'YES'
|
||||
})`
|
||||
: hasNoShares
|
||||
? `(${Math.floor(noShares)} ${isPseudoNumeric ? 'LOWER' : 'NO'})`
|
||||
: ''}
|
||||
</div>
|
||||
)}
|
||||
{user ? (
|
||||
<Button
|
||||
size="lg"
|
||||
|
|
@ -57,6 +46,18 @@ export default function BetButton(props: {
|
|||
) : (
|
||||
<BetSignUpPrompt />
|
||||
)}
|
||||
|
||||
{user && (
|
||||
<div className={'mt-1 w-24 text-center text-sm text-gray-500'}>
|
||||
{hasYesShares
|
||||
? `(${Math.floor(yesShares)} ${
|
||||
isPseudoNumeric ? 'HIGHER' : 'YES'
|
||||
})`
|
||||
: hasNoShares
|
||||
? `(${Math.floor(noShares)} ${isPseudoNumeric ? 'LOWER' : 'NO'})`
|
||||
: ''}
|
||||
</div>
|
||||
)}
|
||||
</Col>
|
||||
|
||||
<Modal open={open} setOpen={setOpen} position="center">
|
||||
|
|
|
|||
|
|
@ -25,11 +25,7 @@ import {
|
|||
} from 'common/calculate'
|
||||
import { AvatarDetails, MiscDetails, ShowTime } from './contract-details'
|
||||
import { getExpectedValue, getValueFromBucket } from 'common/calculate-dpm'
|
||||
import {
|
||||
getColor,
|
||||
ProbBar,
|
||||
QuickBetArrows,
|
||||
} from 'web/components/contract/quick-bet-arrows'
|
||||
import { getColor, ProbBar, QuickBet } from './quick-bet'
|
||||
import { useContractWithPreload } from 'web/hooks/use-contract'
|
||||
import { useUser } from 'web/hooks/use-user'
|
||||
import { track } from '@amplitude/analytics-browser'
|
||||
|
|
@ -105,7 +101,7 @@ export function ContractCard(props: {
|
|||
))}
|
||||
</Col>
|
||||
{showQuickBet ? (
|
||||
<QuickBetArrows contract={contract} user={user} className="z-10" />
|
||||
<QuickBet contract={contract} user={user} className="z-10" />
|
||||
) : (
|
||||
<>
|
||||
{outcomeType === 'BINARY' && (
|
||||
|
|
|
|||
|
|
@ -27,44 +27,21 @@ import {
|
|||
} from 'common/contract'
|
||||
import { ContractDetails, ExtraMobileContractDetails } from './contract-details'
|
||||
import { NumericGraph } from './numeric-graph'
|
||||
import { QuickBetButtons } from 'web/components/contract/quick-bet-button'
|
||||
|
||||
const OverviewQuestion = (props: { text: string }) => (
|
||||
<Linkify className="text-2xl text-indigo-700 md:text-3xl" text={props.text} />
|
||||
)
|
||||
|
||||
const BetWidget = (props: { contract: CPMMContract }) => {
|
||||
const { contract } = props
|
||||
const user = useUser()
|
||||
return (
|
||||
<Col className={'justify-center'}>
|
||||
<Row className={'gap-4'}>
|
||||
{contract.outcomeType === 'BINARY' &&
|
||||
user &&
|
||||
QuickBetButtons({
|
||||
contract: contract as CPMMBinaryContract,
|
||||
user: user,
|
||||
side: 'NO',
|
||||
className: 'self-end min-w-[60px]',
|
||||
})}
|
||||
<BetButton contract={props.contract} />
|
||||
|
||||
{contract.outcomeType === 'BINARY' &&
|
||||
user &&
|
||||
QuickBetButtons({
|
||||
contract: contract as CPMMBinaryContract,
|
||||
user: user,
|
||||
side: 'YES',
|
||||
className: 'self-end min-w-[60px]',
|
||||
})}
|
||||
</Row>
|
||||
<Row className={'items-center justify-center'}>
|
||||
{!user && (
|
||||
<div className="mt-1 text-center text-sm text-gray-500">
|
||||
(with play money!)
|
||||
</div>
|
||||
)}
|
||||
</Row>
|
||||
<Col>
|
||||
<BetButton contract={props.contract} />
|
||||
{!user && (
|
||||
<div className="mt-1 text-center text-sm text-gray-500">
|
||||
(with play money!)
|
||||
</div>
|
||||
)}
|
||||
</Col>
|
||||
)
|
||||
}
|
||||
|
|
@ -108,13 +85,13 @@ const BinaryOverview = (props: { contract: BinaryContract; bets: Bet[] }) => {
|
|||
</Row>
|
||||
<Row className="items-center justify-between gap-4 xl:hidden">
|
||||
<BinaryResolutionOrChance contract={contract} />
|
||||
<ExtraMobileContractDetails contract={contract} />
|
||||
{tradingAllowed(contract) && (
|
||||
<BetWidget contract={contract as CPMMBinaryContract} />
|
||||
)}
|
||||
</Row>
|
||||
</Col>
|
||||
<ContractProbGraph contract={contract} bets={[...bets].reverse()} />
|
||||
<ExtraMobileContractDetails contract={contract} />
|
||||
</Col>
|
||||
)
|
||||
}
|
||||
|
|
@ -163,11 +140,11 @@ const PseudoNumericOverview = (props: {
|
|||
</Row>
|
||||
<Row className="items-center justify-between gap-4 xl:hidden">
|
||||
<PseudoNumericResolutionOrExpectation contract={contract} />
|
||||
<ExtraMobileContractDetails contract={contract} />
|
||||
{tradingAllowed(contract) && <BetWidget contract={contract} />}
|
||||
</Row>
|
||||
</Col>
|
||||
<ContractProbGraph contract={contract} bets={[...bets].reverse()} />
|
||||
<ExtraMobileContractDetails contract={contract} />
|
||||
</Col>
|
||||
)
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,128 +0,0 @@
|
|||
import {
|
||||
getOutcomeProbability,
|
||||
getProbability,
|
||||
getTopAnswer,
|
||||
} from 'common/calculate'
|
||||
import { getExpectedValue } from 'common/calculate-dpm'
|
||||
import { User } from 'common/user'
|
||||
import { Contract, CPMMBinaryContract, NumericContract } from 'common/contract'
|
||||
import { formatMoney } from 'common/util/format'
|
||||
import toast from 'react-hot-toast'
|
||||
import { useUserContractBets } from 'web/hooks/use-user-bets'
|
||||
import { placeBet } from 'web/lib/firebase/api'
|
||||
import { useSaveBinaryShares } from '../use-save-binary-shares'
|
||||
import { sellShares } from 'web/lib/firebase/api'
|
||||
import { calculateCpmmSale } from 'common/calculate-cpmm'
|
||||
import { track } from 'web/lib/service/analytics'
|
||||
import { useUnfilledBets } from 'web/hooks/use-bets'
|
||||
import { getBinaryProb } from 'common/contract-details'
|
||||
import { quickOutcome } from 'web/components/contract/quick-bet-arrows'
|
||||
import { Button } from 'web/components/button'
|
||||
|
||||
const BET_SIZE = 10
|
||||
|
||||
export function QuickBetButtons(props: {
|
||||
contract: CPMMBinaryContract
|
||||
user: User
|
||||
side: 'YES' | 'NO'
|
||||
className?: string
|
||||
}) {
|
||||
const { contract, side, user } = props
|
||||
let sharesSold: number | undefined
|
||||
let sellOutcome: 'YES' | 'NO' | undefined
|
||||
let saleAmount: number | undefined
|
||||
|
||||
const userBets = useUserContractBets(user.id, contract.id)
|
||||
const unfilledBets = useUnfilledBets(contract.id) ?? []
|
||||
|
||||
const { yesShares, noShares } = useSaveBinaryShares(contract, userBets)
|
||||
const oppositeShares = side === 'YES' ? noShares : yesShares
|
||||
if (oppositeShares > 0.01) {
|
||||
sellOutcome = side === 'YES' ? 'NO' : 'YES'
|
||||
|
||||
const prob = getProb(contract)
|
||||
const maxSharesSold =
|
||||
(BET_SIZE + 0.05) / (sellOutcome === 'YES' ? prob : 1 - prob)
|
||||
sharesSold = Math.min(oppositeShares, maxSharesSold)
|
||||
|
||||
const { saleValue } = calculateCpmmSale(
|
||||
contract,
|
||||
sharesSold,
|
||||
sellOutcome,
|
||||
unfilledBets
|
||||
)
|
||||
saleAmount = saleValue
|
||||
}
|
||||
|
||||
async function placeQuickBet() {
|
||||
const betPromise = async () => {
|
||||
if (sharesSold && sellOutcome) {
|
||||
return await sellShares({
|
||||
shares: sharesSold,
|
||||
outcome: sellOutcome,
|
||||
contractId: contract.id,
|
||||
})
|
||||
}
|
||||
|
||||
const outcome = quickOutcome(contract, side === 'YES' ? 'UP' : 'DOWN')
|
||||
return await placeBet({
|
||||
amount: BET_SIZE,
|
||||
outcome,
|
||||
contractId: contract.id,
|
||||
})
|
||||
}
|
||||
const shortQ = contract.question.slice(0, 20)
|
||||
const message =
|
||||
sellOutcome && saleAmount
|
||||
? `${formatMoney(saleAmount)} sold of "${shortQ}"...`
|
||||
: `${formatMoney(BET_SIZE)} on "${shortQ}"...`
|
||||
|
||||
toast.promise(betPromise(), {
|
||||
loading: message,
|
||||
success: message,
|
||||
error: (err) => `${err.message}`,
|
||||
})
|
||||
|
||||
track('quick bet button', {
|
||||
slug: contract.slug,
|
||||
outcome: side,
|
||||
contractId: contract.id,
|
||||
})
|
||||
}
|
||||
|
||||
return (
|
||||
<Button
|
||||
size={'lg'}
|
||||
onClick={() => placeQuickBet()}
|
||||
color={side === 'YES' ? 'green' : 'red'}
|
||||
className={props.className}
|
||||
>
|
||||
{side === 'YES' ? 'Yes' : 'No'}
|
||||
</Button>
|
||||
)
|
||||
}
|
||||
|
||||
// Return a number from 0 to 1 for this contract
|
||||
// Resolved contracts are set to 1, for coloring purposes (even if NO)
|
||||
function getProb(contract: Contract) {
|
||||
const { outcomeType, resolution, resolutionProbability } = contract
|
||||
return resolutionProbability
|
||||
? resolutionProbability
|
||||
: resolution
|
||||
? 1
|
||||
: outcomeType === 'BINARY'
|
||||
? getBinaryProb(contract)
|
||||
: outcomeType === 'PSEUDO_NUMERIC'
|
||||
? getProbability(contract)
|
||||
: outcomeType === 'FREE_RESPONSE' || outcomeType === 'MULTIPLE_CHOICE'
|
||||
? getOutcomeProbability(contract, getTopAnswer(contract)?.id || '')
|
||||
: outcomeType === 'NUMERIC'
|
||||
? getNumericScale(contract)
|
||||
: 1 // Should not happen
|
||||
}
|
||||
|
||||
function getNumericScale(contract: NumericContract) {
|
||||
const { min, max } = contract
|
||||
const ev = getExpectedValue(contract)
|
||||
return (ev - min) / (max - min)
|
||||
}
|
||||
|
|
@ -38,7 +38,7 @@ import { getBinaryProb } from 'common/contract-details'
|
|||
|
||||
const BET_SIZE = 10
|
||||
|
||||
export function QuickBetArrows(props: {
|
||||
export function QuickBet(props: {
|
||||
contract: BinaryContract | PseudoNumericContract
|
||||
user: User
|
||||
className?: string
|
||||
|
|
@ -243,7 +243,7 @@ export function ProbBar(props: { contract: Contract; previewProb?: number }) {
|
|||
)
|
||||
}
|
||||
|
||||
export function quickOutcome(contract: Contract, direction: 'UP' | 'DOWN') {
|
||||
function quickOutcome(contract: Contract, direction: 'UP' | 'DOWN') {
|
||||
const { outcomeType } = contract
|
||||
|
||||
if (outcomeType === 'BINARY' || outcomeType === 'PSEUDO_NUMERIC') {
|
||||
Loading…
Reference in New Issue
Block a user