DPM: label payout 'Estimated' in bet panel

This commit is contained in:
James Grugett 2022-03-22 00:18:08 -05:00
parent a37ab956db
commit cc0beb4ca4
3 changed files with 21 additions and 8 deletions

View File

@ -134,9 +134,11 @@ export function AnswerBetPanel(props: {
</Row> </Row>
</Row> </Row>
<Row className="items-start 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>Payout if chosen</div> <div>
Estimated <br /> payout if chosen
</div>
<InfoTooltip <InfoTooltip
text={`Current payout for ${formatWithCommas( text={`Current payout for ${formatWithCommas(
shares shares

View File

@ -117,9 +117,11 @@ export function CreateAnswerPanel(props: {
</Row> </Row>
</Row> </Row>
<Row className="justify-between gap-2 text-sm"> <Row className="justify-between gap-4 text-sm items-center">
<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>Payout if chosen</div> <div>
Estimated <br /> payout if chosen
</div>
<InfoTooltip <InfoTooltip
text={`Current payout for ${formatWithCommas( text={`Current payout for ${formatWithCommas(
shares shares

View File

@ -119,7 +119,7 @@ export function BetPanel(props: {
focusAmountInput() focusAmountInput()
} }
const tooltip = const dpmTooltip =
contract.mechanism === 'dpm-2' contract.mechanism === 'dpm-2'
? `Current payout for ${formatWithCommas(shares)} / ${formatWithCommas( ? `Current payout for ${formatWithCommas(shares)} / ${formatWithCommas(
shares + shares +
@ -165,13 +165,22 @@ export function BetPanel(props: {
</Row> </Row>
</Row> </Row>
<Row className="items-start 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>
Payout if <OutcomeLabel outcome={betChoice ?? 'YES'} /> {contract.mechanism === 'dpm-2' ? (
<>
Estimated
<br /> payout if <OutcomeLabel outcome={betChoice ?? 'YES'} />
</>
) : (
<>
Payout if <OutcomeLabel outcome={betChoice ?? 'YES'} />
</>
)}
</div> </div>
{tooltip && <InfoTooltip text={tooltip} />} {dpmTooltip && <InfoTooltip text={dpmTooltip} />}
</Row> </Row>
<Row className="flex-wrap items-end justify-end gap-2"> <Row className="flex-wrap items-end justify-end gap-2">
<span className="whitespace-nowrap"> <span className="whitespace-nowrap">