From 8e33c2b639f2da49f927b984430d60e1b2f57915 Mon Sep 17 00:00:00 2001
From: mantikoros <sgrugett@gmail.com>
Date: Thu, 17 Feb 2022 18:24:00 -0600
Subject: [PATCH] for sales, show change in implied probability

---
 common/calculate.ts                    | 14 ++++++++++++++
 web/components/bets-list.tsx           | 23 +++++++++++++++++++++--
 web/components/confirmation-button.tsx |  2 +-
 3 files changed, 36 insertions(+), 3 deletions(-)

diff --git a/common/calculate.ts b/common/calculate.ts
index 3dbb6daf..b03868ed 100644
--- a/common/calculate.ts
+++ b/common/calculate.ts
@@ -34,6 +34,20 @@ export function getProbabilityAfterBet(
   return getOutcomeProbability(newTotalShares, outcome)
 }
 
+export function getProbabilityAfterSale(
+  totalShares: {
+    [outcome: string]: number
+  },
+  outcome: string,
+  shares: number
+) {
+  const prevShares = totalShares[outcome] ?? 0
+  const newTotalShares = { ...totalShares, [outcome]: prevShares - shares }
+
+  const predictionOutcome = outcome === 'NO' ? 'YES' : outcome
+  return getOutcomeProbability(newTotalShares, predictionOutcome)
+}
+
 export function calculateShares(
   totalShares: {
     [outcome: string]: number
diff --git a/web/components/bets-list.tsx b/web/components/bets-list.tsx
index 7af046c5..f6cef617 100644
--- a/web/components/bets-list.tsx
+++ b/web/components/bets-list.tsx
@@ -25,7 +25,9 @@ import { UserLink } from './user-page'
 import {
   calculatePayout,
   calculateSaleAmount,
+  getOutcomeProbability,
   getProbability,
+  getProbabilityAfterSale,
   resolvedPayout,
 } from '../../common/calculate'
 import { sellBet } from '../lib/firebase/api-call'
@@ -496,6 +498,19 @@ function SellButton(props: { contract: Contract; bet: Bet }) {
   const { contract, bet } = props
   const [isSubmitting, setIsSubmitting] = useState(false)
 
+  const initialProb = getOutcomeProbability(
+    contract.totalShares,
+    bet.outcome === 'NO' ? 'YES' : bet.outcome
+  )
+
+  const outcomeProb = getProbabilityAfterSale(
+    contract.totalShares,
+    bet.outcome,
+    bet.shares
+  )
+
+  const saleAmount = calculateSaleAmount(contract, bet)
+
   return (
     <ConfirmationButton
       id={`sell-${bet.id}`}
@@ -515,8 +530,12 @@ function SellButton(props: { contract: Contract; bet: Bet }) {
       </div>
       <div>
         Do you want to sell {formatWithCommas(bet.shares)} shares of{' '}
-        <OutcomeLabel outcome={bet.outcome} /> for{' '}
-        {formatMoney(calculateSaleAmount(contract, bet))}?
+        <OutcomeLabel outcome={bet.outcome} /> for {formatMoney(saleAmount)}?
+      </div>
+
+      <div className="mt-2 mb-1 text-sm text-gray-500">
+        Implied probability: {formatPercent(initialProb)} →{' '}
+        {formatPercent(outcomeProb)}
       </div>
     </ConfirmationButton>
   )
diff --git a/web/components/confirmation-button.tsx b/web/components/confirmation-button.tsx
index cd894968..3911125b 100644
--- a/web/components/confirmation-button.tsx
+++ b/web/components/confirmation-button.tsx
@@ -31,7 +31,7 @@ export function ConfirmationButton(props: {
       <input type="checkbox" id={id} className="modal-toggle" />
 
       <div className="modal">
-        <div className="modal-box">
+        <div className="modal-box whitespace-normal">
           {children}
 
           <div className="modal-action">