From b0d2138645c017576289676648b60eb1d1471c56 Mon Sep 17 00:00:00 2001
From: Ian Philips <iansphilips@gmail.com>
Date: Wed, 15 Jan 2025 18:08:21 -0800
Subject: [PATCH] mani: Use TokenNumber instead of CoinNumber

---
 mani/app/(tabs)/shop.tsx                |  6 +--
 mani/app/redeem.tsx                     | 26 +++++-----
 mani/components/contract/bets.tsx       |  6 +--
 mani/components/widgets/coin-number.tsx | 66 -------------------------
 4 files changed, 19 insertions(+), 85 deletions(-)
 delete mode 100644 mani/components/widgets/coin-number.tsx

diff --git a/mani/app/(tabs)/shop.tsx b/mani/app/(tabs)/shop.tsx
index 2229d3a5ec..dd8cbbab95 100644
--- a/mani/app/(tabs)/shop.tsx
+++ b/mani/app/(tabs)/shop.tsx
@@ -19,7 +19,6 @@ import { introductoryTimeWindow, User } from 'common/user'
 import { formatMoneyUSD } from 'common/util/format'
 import { getVerificationStatus } from 'common/gidx/user'
 import { Rounded } from 'constants/border-radius'
-import { CoinNumber } from 'components/widgets/coin-number'
 import { usePrices } from 'hooks/use-prices'
 import { shortenNumber } from 'common/util/formatNumber'
 import { Image } from 'react-native'
@@ -28,6 +27,7 @@ import buyMana25k from '../../assets/images/buy-mana-graphics/25k.png'
 import buyMana100k from '../../assets/images/buy-mana-graphics/100k.png'
 import buyMana1M from '../../assets/images/buy-mana-graphics/1M.png'
 import { IosIapListener } from 'components/ios-iap-listener'
+import { TokenNumber } from 'components/token/token-number'
 
 export default function Shop() {
   const user = useUser()
@@ -180,11 +180,11 @@ function PriceTile(props: {
           style={{ width: 120, height: 120 }}
         />
         <Row style={styles.priceTileHeader}>
-          <CoinNumber amount={amounts.mana} token="MANA" />
+          <TokenNumber amount={amounts.mana} token="MANA" />
           {amounts.bonusInDollars > 0 && (
             <>
               <ThemedText style={styles.plus}> + </ThemedText>
-              <CoinNumber amount={amounts.bonusInDollars} token="CASH" />
+              <TokenNumber amount={amounts.bonusInDollars} token="CASH" />
             </>
           )}
         </Row>
diff --git a/mani/app/redeem.tsx b/mani/app/redeem.tsx
index 405f618121..cc42cbc0e1 100644
--- a/mani/app/redeem.tsx
+++ b/mani/app/redeem.tsx
@@ -36,7 +36,6 @@ import {
   PROMPT_USER_VERIFICATION_MESSAGES,
 } from 'common/gidx/user'
 import { capitalize } from 'lodash'
-import { CoinNumber } from 'components/widgets/coin-number'
 import { Input } from 'components/widgets/input'
 import { api } from 'lib/api'
 import { useAPIGetter } from 'hooks/use-api-getter'
@@ -50,6 +49,7 @@ import { Col } from 'components/layout/col'
 import Page from 'components/page'
 import { Button } from 'components/buttons/button'
 import { ContractToken } from 'common/contract'
+import { TokenNumber } from 'components/token/token-number'
 
 export type CashoutPagesType =
   | 'select-cashout-method'
@@ -65,7 +65,7 @@ type MoneyCashoutPagesType =
 
 type ManaCashoutPagesType = 'custom-mana'
 
-const CASHOUTS_PER_PAGE = 10
+// const CASHOUTS_PER_PAGE = 10
 
 export default function CashoutPage() {
   const user = useUser()
@@ -536,7 +536,7 @@ function SweepiesStats(props: {
     <Col style={[styles.stats, props.style]}>
       <Row style={styles.statsRow}>
         <Text style={styles.statsLabel}>Redeemable</Text>
-        <CoinNumber
+        <TokenNumber
           amount={redeemableCash}
           style={styles.statsAmount}
           token="CASH"
@@ -545,7 +545,7 @@ function SweepiesStats(props: {
       <View style={styles.statsSeparator} />
       <Row style={styles.statsRow}>
         <Text style={styles.statsLabel}>Total</Text>
-        <CoinNumber
+        <TokenNumber
           amount={cashBalance}
           style={styles.statsAmount}
           token="CASH"
@@ -574,13 +574,13 @@ function SelectCashoutOptions(props: {
   allDisabled?: boolean
 }) {
   const { setPage, allDisabled, redeemableCash, redeemForUSDPageName } = props
-  const [cashoutPage, setCashoutPage] = useState(0)
-
-  const { data: cashouts } = useAPIGetter('get-cashouts', {
-    limit: CASHOUTS_PER_PAGE,
-    offset: cashoutPage * CASHOUTS_PER_PAGE,
-    userId: props.user.id,
-  })
+  // const [cashoutPage, setCashoutPage] = useState(0)
+  //
+  // const { data: cashouts } = useAPIGetter('get-cashouts', {
+  //   limit: CASHOUTS_PER_PAGE,
+  //   offset: cashoutPage * CASHOUTS_PER_PAGE,
+  //   userId: props.user.id,
+  // })
 
   const noHasMinRedeemableCash = redeemableCash < MIN_CASHOUT_AMOUNT
   const hasNoRedeemableCash = redeemableCash === 0
@@ -611,7 +611,7 @@ function SelectCashoutOptions(props: {
               <Text>Redeem for mana</Text>
             </Button>
             <Row style={styles.valueRow}>
-              <CoinNumber
+              <TokenNumber
                 amount={redeemableCash * CASH_TO_MANA_CONVERSION_RATE}
                 style={[
                   styles.valueText,
@@ -662,7 +662,7 @@ function SelectCashoutOptions(props: {
               {noHasMinRedeemableCash && !allDisabled ? (
                 <Row style={{ alignItems: 'center' }}>
                   <Text style={styles.errorText}>You need at least </Text>
-                  <CoinNumber
+                  <TokenNumber
                     amount={MIN_CASHOUT_AMOUNT}
                     token="CASH"
                     style={[
diff --git a/mani/components/contract/bets.tsx b/mani/components/contract/bets.tsx
index 023458977a..8d08922937 100644
--- a/mani/components/contract/bets.tsx
+++ b/mani/components/contract/bets.tsx
@@ -8,10 +8,10 @@ import { Row } from 'components/layout/row'
 import { Col } from 'components/layout/col'
 import { ThemedText } from 'components/themed-text'
 import { useDisplayUserById, useUser } from 'hooks/use-user'
-import { CoinNumber } from 'components/widgets/coin-number'
 import { useContractBets } from 'client-common/hooks/use-bets'
 import { api } from 'lib/api'
 import { useIsPageVisible } from 'hooks/use-is-page-visibile'
+import { TokenNumber } from 'components/token/token-number'
 
 export function Bets(props: { contract: Contract; totalBets: number }) {
   const { contract } = props
@@ -105,10 +105,10 @@ export function BetStatusText(props: {
       : getBinaryMCProb(bet.limitProb, outcome)
   const bought = amount >= 0 ? 'bought' : 'sold'
   const absAmount = Math.abs(amount)
-  const money = <CoinNumber amount={absAmount} token={contract.token} />
+  const money = <TokenNumber amount={absAmount} token={contract.token} />
   const orderAmount =
     bet.limitProb !== undefined && bet.orderAmount !== undefined ? (
-      <CoinNumber amount={bet.orderAmount} token={contract.token} />
+      <TokenNumber amount={bet.orderAmount} token={contract.token} />
     ) : null
   const anyFilled = !floatingLesserEqual(amount, 0)
   const allFilled = floatingEqual(amount, bet.orderAmount ?? amount)
diff --git a/mani/components/widgets/coin-number.tsx b/mani/components/widgets/coin-number.tsx
deleted file mode 100644
index 1da3769142..0000000000
--- a/mani/components/widgets/coin-number.tsx
+++ /dev/null
@@ -1,66 +0,0 @@
-import { Text, Image } from 'react-native'
-import { ContractToken } from 'common/contract'
-import {
-  formatMoneyNoMoniker,
-  formatSweepiesNumber,
-  getMoneyNumberToDecimal,
-} from 'common/util/format'
-import { shortenNumber } from 'common/util/formatNumber'
-import { Row } from '../layout/row'
-import ManaFlatImage from '../../assets/images/masses_mana_flat.png'
-import SweepsFlatImage from '../../assets/images/masses_sweeps_flat.png'
-import { useTokenMode } from 'hooks/use-token-mode'
-import { Colors } from 'constants/colors'
-
-export type NumberDisplayType = 'short' | 'animated' | 'toDecimal'
-
-export function CoinNumber(props: {
-  amount?: number
-  token?: ContractToken
-  numberType?: NumberDisplayType
-  hideAmount?: boolean
-  style?: any
-}) {
-  const { hideAmount, amount, token = 'MANA', numberType, style } = props
-
-  const { token: tokenSetting } = useTokenMode()
-  const isCash = !token ? tokenSetting === 'CASH' : token === 'CASH'
-
-  const textStyle = { color: Colors.text }
-
-  return (
-    <Row style={[{ alignItems: 'center', gap: 4 }, style]}>
-      {amount !== undefined && amount <= -1 && <Text style={textStyle}>-</Text>}
-      <Image
-        source={isCash ? SweepsFlatImage : ManaFlatImage}
-        style={{ width: 20, height: 20 }}
-      />
-      {hideAmount ? (
-        <Text style={textStyle} />
-      ) : amount == undefined ? (
-        <Text style={textStyle}>---</Text>
-      ) : isCash ? (
-        <Text style={[textStyle, style]}>
-          {formatSweepiesNumber(Math.abs(amount ?? 0), {
-            toDecimal: numberType == 'toDecimal' ? 2 : undefined,
-            short: numberType == 'short' ? true : false,
-          })}
-        </Text>
-      ) : numberType == 'short' ? (
-        <Text style={[textStyle, style]}>
-          {shortenNumber(
-            +formatMoneyNoMoniker(Math.abs(amount ?? 0)).replaceAll(',', '')
-          )}
-        </Text>
-      ) : numberType == 'toDecimal' ? (
-        <Text style={[textStyle, style]}>
-          {getMoneyNumberToDecimal(Math.abs(amount ?? 0))}
-        </Text>
-      ) : (
-        <Text style={[textStyle, style]}>
-          {formatMoneyNoMoniker(Math.abs(amount))}
-        </Text>
-      )}
-    </Row>
-  )
-}