New create challenge panel

This commit is contained in:
Ian Philips 2022-08-03 10:46:50 -06:00
parent 4252157290
commit 903264b9be
5 changed files with 79 additions and 35 deletions

View File

@ -64,6 +64,8 @@ export const acceptchallenge = newEndpoint({}, async (req, auth) => {
const contract = anyContract as CPMMBinaryContract
const shares = (1 / creatorOutcomeProb) * creatorAmount
const createdTime = Date.now()
const probOfYes =
creatorOutcome === 'YES' ? creatorOutcomeProb : 1 - creatorOutcomeProb
log(
'Creating challenge bet for',
@ -80,12 +82,12 @@ export const acceptchallenge = newEndpoint({}, async (req, auth) => {
const yourNewBet: CandidateBet = removeUndefinedProps({
orderAmount: acceptorAmount,
amount: acceptorAmount,
shares: shares,
shares,
isCancelled: false,
contractId: contract.id,
outcome: acceptorOutcome,
probBefore: creatorOutcomeProb,
probAfter: creatorOutcomeProb,
probBefore: probOfYes,
probAfter: probOfYes,
loanAmount: 0,
createdTime,
fees: noFees,
@ -103,12 +105,12 @@ export const acceptchallenge = newEndpoint({}, async (req, auth) => {
const creatorNewBet: CandidateBet = removeUndefinedProps({
orderAmount: creatorAmount,
amount: creatorAmount,
shares: shares,
shares,
isCancelled: false,
contractId: contract.id,
outcome: creatorOutcome,
probBefore: creatorOutcomeProb,
probAfter: creatorOutcomeProb,
probBefore: probOfYes,
probAfter: probOfYes,
loanAmount: 0,
createdTime,
fees: noFees,

View File

@ -15,15 +15,12 @@ function buildCardUrl(props: OgCardProps, challenge?: Challenge) {
const {
creatorAmount,
acceptances,
creatorOutcomeProb,
acceptorAmount,
creatorOutcome,
acceptorOutcome,
} = challenge || {}
const { userName, userAvatarUrl } = acceptances?.[0] ?? {}
const challengeAmount =
creatorOutcomeProb &&
creatorAmount &&
Math.round(((1 - creatorOutcomeProb) / creatorOutcomeProb) * creatorAmount)
const probabilityParam =
props.probability === undefined
? ''
@ -35,7 +32,7 @@ function buildCardUrl(props: OgCardProps, challenge?: Challenge) {
const challengeUrlParams = challenge
? `&creatorAmount=${creatorAmount}&creatorOutcome=${creatorOutcome}` +
`&challengerAmount=${challengeAmount}&challengerOutcome=${acceptorOutcome}` +
`&challengerAmount=${acceptorAmount}&challengerOutcome=${acceptorOutcome}` +
`&acceptedName=${userName ?? ''}&acceptedAvatarUrl=${userAvatarUrl ?? ''}`
: ''

View File

@ -1,7 +1,12 @@
import clsx from 'clsx'
import dayjs from 'dayjs'
import { useEffect, useState } from 'react'
import { DuplicateIcon } from '@heroicons/react/outline'
import {
AdjustmentsIcon,
CogIcon,
DuplicateIcon,
PencilIcon,
} from '@heroicons/react/outline'
import { Col } from '../layout/col'
import { Row } from '../layout/row'
@ -80,12 +85,11 @@ function CreateChallengeForm(props: {
const [isCreating, setIsCreating] = useState(false)
const [finishedCreating, setFinishedCreating] = useState(false)
const [error, setError] = useState<string>('')
const [editingAcceptorAmount, setEditingAcceptorAmount] = useState(false)
const defaultExpire = 'week'
const defaultMessage = `${user.name} is challenging you to a bet! Do you think ${contract.question}`
const prob = Math.round(getOutcomeProbability(contract, 'YES') * 100) / 100 // round to whole percentage
const [challengeInfo, setChallengeInfo] = useState<challengeInfo>({
expiresTime: dayjs().add(2, defaultExpire).valueOf(),
outcome: 'YES',
@ -97,10 +101,6 @@ function CreateChallengeForm(props: {
setError('')
}, [challengeInfo])
const p = challengeInfo.outcome === 'YES' ? prob : 1 - prob
const friendCost = ((1 - p) / p) * challengeInfo.amount
return (
<>
{!finishedCreating && (
@ -117,7 +117,6 @@ function CreateChallengeForm(props: {
}}
>
<Title className="!mt-2" text="Challenge a friend to bet " />
{/*<Row className="label ">How much?</Row>*/}
<div className="mt-2 flex flex-col flex-wrap gap-x-5 gap-y-2">
{/*<div>Question:</div>*/}
{/*<div className="mb-4 italic">{contract.question}</div>*/}
@ -136,7 +135,13 @@ function CreateChallengeForm(props: {
value={challengeInfo.amount}
onChange={(e) =>
setChallengeInfo((m: challengeInfo) => {
return { ...m, amount: parseInt(e.target.value) }
return {
...m,
amount: parseInt(e.target.value),
acceptorAmount: editingAcceptorAmount
? m.acceptorAmount
: parseInt(e.target.value),
}
})
}
/>
@ -162,11 +167,55 @@ function CreateChallengeForm(props: {
</Col>
</Row>
<Spacer h={2} />
<div>They will bet:</div>
<div>
<span className="bold">{formatMoney(friendCost)}</span> on{' '}
{challengeInfo.outcome === 'YES' ? <NoLabel /> : <YesLabel />}
</div>
<Row className={'items-center'}>They will bet:</Row>
<Row className={'items-center gap-2'}>
<div className={'ml-1 min-w-[90px]'}>
{editingAcceptorAmount ? (
<Col>
<div className="relative">
<span className="absolute mx-3 mt-3.5 text-sm text-gray-400">
M$
</span>
<input
className="input input-bordered w-40 pl-10"
type="number"
min={1}
value={challengeInfo.acceptorAmount}
onChange={(e) =>
setChallengeInfo((m: challengeInfo) => {
return {
...m,
acceptorAmount: parseInt(e.target.value),
}
})
}
/>
</div>
</Col>
) : (
<span className="font-bold">
{formatMoney(challengeInfo.acceptorAmount)}
</span>
)}
</div>
<Row className={'items-center gap-3'}>
on
{challengeInfo.outcome === 'YES' ? <NoLabel /> : <YesLabel />}
{!editingAcceptorAmount && (
<Button
color={'gray'}
onClick={() =>
setEditingAcceptorAmount(!editingAcceptorAmount)
}
className={
'flex flex-row gap-2 !bg-transparent py-1 hover:!bg-gray-100'
}
>
Edit
</Button>
)}
</Row>
</Row>
</div>
<Row className={'justify-end'}>
<Button

View File

@ -52,21 +52,19 @@ export async function createChallenge(data: {
if (creatorAmount <= 0 || isNaN(creatorAmount) || !isFinite(creatorAmount))
return null
const prob = 1 / (acceptorAmount / creatorAmount + 1)
const challenge: Challenge = {
slug,
creatorId: creator.id,
creatorUsername: creator.username,
creatorName: creator.name,
creatorAvatarUrl: creator.avatarUrl,
creatorAmount: creatorAmount,
creatorAmount,
creatorOutcome: outcome.toString(),
creatorOutcomeProb: creatorAmount / (creatorAmount + acceptorAmount),
acceptorOutcome: outcome === 'YES' ? 'NO' : 'YES',
acceptorAmount,
contractSlug: contract.slug,
contractId: contract.id,
creatorOutcome: outcome.toString(),
acceptorOutcome: outcome === 'YES' ? 'NO' : 'YES',
creatorOutcomeProb: prob,
acceptorAmount,
createdTime: Date.now(),
expiresTime,
maxUses: 1,

View File

@ -140,7 +140,6 @@ function ClosedChallengeContent(props: {
acceptances,
creatorAmount,
creatorOutcome,
creatorOutcomeProb,
acceptorOutcome,
acceptorAmount,
} = challenge
@ -156,7 +155,6 @@ function ClosedChallengeContent(props: {
}, [acceptances])
const creatorWon = resolution === creatorOutcome
const amountWon = creatorWon ? acceptorAmount : creatorAmount
const href = `https://${DOMAIN}${contractPath(contract)}`