Show fractional shares for advanced traders

common/src/util/format.ts

@@ -38,7 +38,9 @@ export function getMoneyNumber(amount: number) {
 }
 
 export function formatMoneyWithDecimals(amount: number) {
-  return ENV_CONFIG.moneyMoniker + amount.toFixed(2)
+  const plusEpsilon = amount + 0.00000000001 * Math.sign(amount)
+  const newAmount = Math.round(plusEpsilon) === 0 ? 0 : Math.trunc(plusEpsilon * 100) / 100
+  return ENV_CONFIG.moneyMoniker + newAmount
 }
 
 export function formatMoneyToDecimal(amount: number) {

web/components/bet/bet-panel.tsx

@@ -17,6 +17,7 @@ import {
   formatMoney,
   formatOutcomeLabel,
   formatPercent,
+  formatMoneyWithDecimals,
 } from 'common/util/format'
 import { computeCpmmBet } from 'common/new-bet'
 import { User, firebaseLogin } from 'web/lib/firebase/users'
@@ -41,6 +42,7 @@ import { getCpmmProbability } from 'common/calculate-cpmm'
 import { removeUndefinedProps } from 'common/util/object'
 import { calculateCpmmMultiArbitrageBet } from 'common/calculate-cpmm-arbitrage'
 import LimitOrderPanel from './limit-order-panel'
+import { useIsAdvancedTrader } from 'web/hooks/use-is-advanced-trader'
 
 export type BinaryOutcomes = 'YES' | 'NO' | undefined
 
@@ -255,6 +257,8 @@ export function BuyPanel(props: {
 
   const selected = seeLimit ? 'LIMIT' : outcome
 
+  const isAdvancedTrader = useIsAdvancedTrader()
+
   return (
     <Col>
       <Row
@@ -336,6 +340,8 @@ export function BuyPanel(props: {
                     ? getStonkDisplayShares(contract, currentPayout, 2)
                     : isPseudoNumeric
                     ? Math.floor(currentPayout)
+                    : isAdvancedTrader
+                    ? formatMoneyWithDecimals(currentPayout)
                     : formatMoney(currentPayout)}
                 </span>
                 <span className="text-ink-500 pr-3 text-sm">

web/components/bet/bet-summary.tsx

@@ -1,6 +1,9 @@
 import clsx from 'clsx'
 
-import { formatMoney } from 'common/util/format'
+import { 
+  formatMoney,
+  formatMoneyWithDecimals,
+} from 'common/util/format'
 import { Col } from '../layout/col'
 import { Contract } from 'web/lib/firebase/contracts'
 import { Row } from '../layout/row'
@@ -15,6 +18,7 @@ import { getWinningTweet, TweetButton } from '../buttons/tweet-button'
 import { CPMMContract } from 'common/contract'
 import { SellRow } from 'web/components/bet/sell-row'
 import { User } from 'common/user'
+import { useIsAdvancedTrader } from 'web/hooks/use-is-advanced-trader'
 
 export function UserBetsSummary(props: {
   contract: Contract
@@ -80,6 +84,8 @@ export function BetsSummary(props: {
   const prob = contract.mechanism === 'cpmm-1' ? getProbability(contract) : 0
   const expectation = prob * yesWinnings + (1 - prob) * noWinnings
 
+  const isAdvancedTrader = useIsAdvancedTrader()
+
   if (metrics.invested === 0 && metrics.profit === 0) return null
 
   return (
@@ -89,7 +95,9 @@ export function BetsSummary(props: {
           <Col>
             <div className="text-ink-500 text-sm">Payout</div>
             <div className="whitespace-nowrap">
-              {formatMoney(payout)}{' '}
+              {isAdvancedTrader
+                ? formatMoneyWithDecimals(payout)
+                : formatMoney(payout)}{' '}
               <ProfitBadge profitPercent={profitPercent} />
             </div>
           </Col>
@@ -128,11 +136,11 @@ export function BetsSummary(props: {
                 <div className="whitespace-nowrap">
                   {position > 1e-7 ? (
                     <>
-                      {formatMoney(position)} on <YesLabel />
+                      {isAdvancedTrader ? formatMoneyWithDecimals(position) : formatMoney(position)} on <YesLabel />
                     </>
                   ) : position < -1e-7 ? (
                     <>
-                      {formatMoney(-position)} on <NoLabel />
+                      {isAdvancedTrader ? formatMoneyWithDecimals(-position) : formatMoney(-position)} on <NoLabel />
                     </>
                   ) : (
                     '——'
@@ -150,7 +158,7 @@ export function BetsSummary(props: {
                       } position in the question is worth right now according to the current probability.`}
                     />
                   </div>
-                  <div className="whitespace-nowrap">{formatMoney(payout)}</div>
+                  <div className="whitespace-nowrap">{isAdvancedTrader ? formatMoneyWithDecimals(payout) : formatMoney(payout)}</div>
                 </Col>
               )
             )}
@@ -171,7 +179,7 @@ export function BetsSummary(props: {
             Spent{' '}
             <InfoTooltip text="Cost basis. Cash originally invested in this question, using average cost accounting." />
           </div>
-          <div className="whitespace-nowrap">{formatMoney(invested)}</div>
+          <div className="whitespace-nowrap">{isAdvancedTrader ? formatMoneyWithDecimals(invested) : formatMoney(invested)}</div>
         </Col>
 
         {isBinary && !resolution && !hideValue && (
@@ -184,7 +192,7 @@ export function BetsSummary(props: {
                 } position in the question is worth right now according to the current probability.`}
               />
             </div>
-            <div className="whitespace-nowrap">{formatMoney(expectation)}</div>
+            <div className="whitespace-nowrap">{isAdvancedTrader ? formatMoneyWithDecimals(expectation) : formatMoney(expectation)}</div>
           </Col>
         )}
 
@@ -199,7 +207,7 @@ export function BetsSummary(props: {
               />
             </div>
             <div className="whitespace-nowrap">
-              {formatMoney(profit)}
+              {isAdvancedTrader ? formatMoneyWithDecimals(profit) : formatMoney(profit)}
               <ProfitBadge profitPercent={profitPercent} round={true} />
             </div>
           </Col>