bet labeling

web/components/bets-list.tsx

@@ -8,6 +8,7 @@ import { useUserBets } from 'web/hooks/use-user-bets'
 import { Bet } from 'web/lib/firebase/bets'
 import { User } from 'web/lib/firebase/users'
 import {
+  formatLargeNumber,
   formatMoney,
   formatPercent,
   formatWithCommas,
@@ -24,13 +25,7 @@ import { Row } from './layout/row'
 import { UserLink } from './user-page'
 import { sellBet } from 'web/lib/firebase/api-call'
 import { ConfirmationButton } from './confirmation-button'
-import {
-  OutcomeLabel,
-  YesLabel,
-  NoLabel,
-  HigherLabel,
-  LowerLabel,
-} from './outcome-label'
+import { OutcomeLabel, YesLabel, NoLabel } from './outcome-label'
 import { filterDefined } from 'common/util/array'
 import { LoadingIndicator } from './loading-indicator'
 import { SiteLink } from './site-link'
@@ -46,6 +41,7 @@ import {
 import { useTimeSinceFirstRender } from 'web/hooks/use-time-since-first-render'
 import { trackLatency } from 'web/lib/firebase/tracking'
 import { NumericContract } from 'common/contract'
+import { formatNumericProbability } from 'common/pseudo-numeric'
 import { useUser } from 'web/hooks/use-user'
 import { SellSharesModal } from './sell-modal'
 
@@ -438,7 +434,7 @@ export function BetsSummary(props: {
               <>
                 <Col>
                   <div className="whitespace-nowrap text-sm text-gray-500">
-                    Payout if <HigherLabel />
+                    Payout if {'>='} {formatLargeNumber(contract.max)}
                   </div>
                   <div className="whitespace-nowrap">
                     {formatMoney(yesWinnings)}
@@ -446,7 +442,7 @@ export function BetsSummary(props: {
                 </Col>
                 <Col>
                   <div className="whitespace-nowrap text-sm text-gray-500">
-                    Payout if <LowerLabel />
+                    Payout if {'<='} {formatLargeNumber(contract.min)}
                   </div>
                   <div className="whitespace-nowrap">
                     {formatMoney(noWinnings)}
@@ -533,13 +529,15 @@ export function ContractBetsTable(props: {
   const { isResolved, mechanism, outcomeType } = contract
   const isCPMM = mechanism === 'cpmm-1'
   const isNumeric = outcomeType === 'NUMERIC'
+  const isPseudoNumeric = outcomeType === 'PSEUDO_NUMERIC'
 
   return (
     <div className={clsx('overflow-x-auto', className)}>
       {amountRedeemed > 0 && (
         <>
           <div className="pl-2 text-sm text-gray-500">
-            {amountRedeemed} YES shares and {amountRedeemed} NO shares
+            {amountRedeemed} {isPseudoNumeric ? 'HIGHER' : 'YES'} shares and{' '}
+            {amountRedeemed} {isPseudoNumeric ? 'LOWER' : 'NO'} shares
             automatically redeemed for {formatMoney(amountRedeemed)}.
           </div>
           <Spacer h={4} />
@@ -567,7 +565,7 @@ export function ContractBetsTable(props: {
             )}
             {!isCPMM && !isResolved && <th>Payout if chosen</th>}
             <th>Shares</th>
-            <th>Probability</th>
+            {!isPseudoNumeric && <th>Probability</th>}
             <th>Date</th>
           </tr>
         </thead>
@@ -611,6 +609,7 @@ function BetRow(props: {
 
   const isCPMM = mechanism === 'cpmm-1'
   const isNumeric = outcomeType === 'NUMERIC'
+  const isPseudoNumeric = outcomeType === 'PSEUDO_NUMERIC'
 
   const saleAmount = saleBet?.sale?.amount
 
@@ -654,14 +653,17 @@ function BetRow(props: {
             truncate="short"
           />
         )}
+        {isPseudoNumeric && ' than ' +formatNumericProbability(bet.probAfter, contract)}
       </td>
       <td>{formatMoney(Math.abs(amount))}</td>
       {!isCPMM && !isNumeric && <td>{saleDisplay}</td>}
       {!isCPMM && !isResolved && <td>{payoutIfChosenDisplay}</td>}
       <td>{formatWithCommas(Math.abs(shares))}</td>
-      <td>
-        {formatPercent(probBefore)} → {formatPercent(probAfter)}
-      </td>
+      {!isPseudoNumeric && (
+        <td>
+          {formatPercent(probBefore)} → {formatPercent(probAfter)}
+        </td>
+      )}
       <td>{dayjs(createdTime).format('MMM D, h:mma')}</td>
     </tr>
   )

web/components/feed/feed-bets.tsx

@@ -7,13 +7,14 @@ import { Row } from 'web/components/layout/row'
 import { Avatar, EmptyAvatar } from 'web/components/avatar'
 import clsx from 'clsx'
 import { UsersIcon } from '@heroicons/react/solid'
-import { formatMoney } from 'common/util/format'
+import { formatMoney, formatPercent } from 'common/util/format'
 import { OutcomeLabel } from 'web/components/outcome-label'
 import { RelativeTimestamp } from 'web/components/relative-timestamp'
 import React, { Fragment } from 'react'
 import { uniqBy, partition, sumBy, groupBy } from 'lodash'
 import { JoinSpans } from 'web/components/join-spans'
 import { UserLink } from '../user-page'
+import { formatNumericProbability } from 'common/pseudo-numeric'
 
 export function FeedBet(props: {
   contract: Contract
@@ -75,6 +76,8 @@ export function BetStatusText(props: {
   hideOutcome?: boolean
 }) {
   const { bet, contract, bettor, isSelf, hideOutcome } = props
+  const { outcomeType } = contract
+  const isPseudoNumeric = outcomeType === 'PSEUDO_NUMERIC'
   const { amount, outcome, createdTime } = bet
 
   const bought = amount >= 0 ? 'bought' : 'sold'
@@ -97,7 +100,10 @@ export function BetStatusText(props: {
             value={(bet as any).value}
             contract={contract}
             truncate="short"
-          />
+          />{' '}
+          {isPseudoNumeric
+            ? ' than ' + formatNumericProbability(bet.probAfter, contract)
+            : ' at ' + formatPercent(bet.probAfter)}
         </>
       )}
       <RelativeTimestamp time={createdTime} />

web/components/outcome-label.tsx

@@ -112,11 +112,11 @@ export function YesLabel() {
 }
 
 export function HigherLabel() {
-  return <span className="text-primary">HIGH</span>
+  return <span className="text-primary">HIGHER</span>
 }
 
 export function LowerLabel() {
-  return <span className="text-red-400">LOW</span>
+  return <span className="text-red-400">LOWER</span>
 }
 
 export function NoLabel() {

web/components/yes-no-selector.tsx

@@ -43,7 +43,7 @@ export function YesNoSelector(props: {
           )}
           onClick={() => onSelect('YES')}
         >
-          {isPseudoNumeric ? 'Higher' : 'Bet YES'}
+          {isPseudoNumeric ? 'HIGHER' : 'Bet YES'}
         </button>
       )}
       {replaceNoButton ? (
@@ -60,7 +60,7 @@ export function YesNoSelector(props: {
           )}
           onClick={() => onSelect('NO')}
         >
-          {isPseudoNumeric ? 'Lower' : 'Bet NO'}
+          {isPseudoNumeric ? 'LOWER' : 'Bet NO'}
         </button>
       )}
     </Row>