mani: Use TokenNumber instead of CoinNumber

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>

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={[

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)