diff --git a/src/components/Porfolio/PortfolioCard.tsx b/src/components/Porfolio/PortfolioCard.tsx index 3bca6245b..997c40dfe 100644 --- a/src/components/Porfolio/PortfolioCard.tsx +++ b/src/components/Porfolio/PortfolioCard.tsx @@ -27,8 +27,7 @@ const SelectedCard = ({ icon?: string color?: string }) => { - const isRifToken = - icon?.toUpperCase() === 'RIF' || icon?.toUpperCase() === 'TRIF' + const isRifToken = ['RIF', 'TRIF'].includes(icon?.toUpperCase() || '') return ( @@ -44,7 +43,11 @@ const SelectedCard = ({ ) : null} 4 + ? selectedCardStyles.primaryTextLong + : selectedCardStyles.primaryText + } accessibilityLabel="symbol"> {primaryText} @@ -153,6 +156,9 @@ const selectedCardStyles = StyleSheet.create({ fontSize: 22, paddingTop: 3, }), + primaryTextLong: castStyle.text({ + fontSize: 18, + }), }) const nonSelectedCardStyles = StyleSheet.create({ diff --git a/src/core/setup.ts b/src/core/setup.ts index bb1bec4a3..4947167a4 100644 --- a/src/core/setup.ts +++ b/src/core/setup.ts @@ -14,6 +14,7 @@ import { chainTypesById, ChainTypesByIdType, } from 'shared/constants/chainConstants' +import { USDRIF_TESTNET } from 'src/screens/home/TokenImage' import { getWalletSetting } from './config' @@ -90,7 +91,8 @@ const defaultTestnetTokens: ITokenWithoutLogo[] = Object.keys(testnetContracts) usdBalance: 0, } }) -export const getDefaultTokens = (chainId: ChainTypesByIdType) => - chainTypesById[chainId] === ChainTypeEnum.MAINNET +export const getDefaultTokens = (chainId: ChainTypesByIdType) => { + return chainTypesById[chainId] === ChainTypeEnum.MAINNET ? defaultMainnetTokens - : defaultTestnetTokens + : [...defaultTestnetTokens, USDRIF_TESTNET] +} diff --git a/src/images/usdrif-transparent.png b/src/images/usdrif-transparent.png new file mode 100644 index 000000000..aa230e64a Binary files /dev/null and b/src/images/usdrif-transparent.png differ diff --git a/src/images/usdrif.png b/src/images/usdrif.png new file mode 100644 index 000000000..672341fea Binary files /dev/null and b/src/images/usdrif.png differ diff --git a/src/redux/slices/balancesSlice/index.ts b/src/redux/slices/balancesSlice/index.ts index 154f3bc1c..dad41c553 100644 --- a/src/redux/slices/balancesSlice/index.ts +++ b/src/redux/slices/balancesSlice/index.ts @@ -4,24 +4,32 @@ import { convertBtcToSatoshi, } from '@rsksmart/rif-wallet-bitcoin' import { ITokenWithBalance } from '@rsksmart/rif-wallet-services' +import { BigNumber } from 'ethers' +import { parseUnits } from 'ethers/lib/utils' import { balanceToDisplay, convertBalance } from 'lib/utils' +import { resetSocketState } from 'store/shared/actions/resetSocketState' import { BalanceState, ITokenWithoutLogo, TokenBalanceObject, } from 'store/slices/balancesSlice/types' -import { resetSocketState } from 'store/shared/actions/resetSocketState' import { AsyncThunkWithTypes } from 'store/store' export const getBalance = ( token: ITokenWithBalance | BitcoinNetworkWithBIPRequest, price: number, ) => { - let tokenBalance = token.balance.toString() + let tokenBalance: BigNumber if ('satoshis' in token) { - tokenBalance = convertBtcToSatoshi(tokenBalance).toString() + tokenBalance = convertBtcToSatoshi(token.balance.toString()) + } else { + try { + tokenBalance = BigNumber.from(token.balance) + } catch { + tokenBalance = parseUnits(token.balance, token.decimals) + } } let balance = balanceToDisplay(tokenBalance, token.decimals, 4) @@ -46,13 +54,13 @@ export const addOrUpdateBalances = createAsyncThunk< try { const { usdPrices, settings } = thunkAPI.getState() const bitcoin = settings.bitcoin - const balances: TokenBalanceObject[] = payload.map(b => { + const balances: TokenBalanceObject[] = payload.map(t => { const { balance, usdBalance } = getBalance( - b, - usdPrices[b.contractAddress]?.price ?? 0, + t, + usdPrices[t.contractAddress]?.price ?? 0, ) return { - ...b, + ...t, balance, usdBalance, } @@ -77,6 +85,7 @@ export const addOrUpdateBalances = createAsyncThunk< thunkAPI.dispatch(addOrUpdateBalancesState(balances)) } catch (err) { + console.warn('Error adding or updating balances', err) thunkAPI.rejectWithValue(err) } }) diff --git a/src/screens/home/TokenImage.tsx b/src/screens/home/TokenImage.tsx index 80da15f21..ec7ab9368 100644 --- a/src/screens/home/TokenImage.tsx +++ b/src/screens/home/TokenImage.tsx @@ -10,6 +10,7 @@ import { import { FrownFaceIcon } from 'components/icons' import { sharedColors } from 'shared/constants' +import { ITokenWithoutLogo } from 'src/redux/slices/balancesSlice/types' interface Props { symbol: string @@ -65,6 +66,7 @@ export enum TokenSymbol { TRIF = 'tRIF', DOC = 'DOC', RDOC = 'RDOC', + USDRIF = 'USDRIF', RIFP = 'RIFP', BPRO = 'BPRO', RNS = 'RNS', @@ -142,6 +144,8 @@ export const getTransparentIconSource = ( return require('../../images/rif-white.png') case 'RDOC': return require('./../../images/rdoc-transparent.png') + case 'USDRIF': + return require('./../../images/usdrif-transparent.png') case 'BTCCB': case 'BTCT': case 'BTC': @@ -168,6 +172,8 @@ export const getIconSource = ( return require('@rsksmart/rsk-contract-metadata/images/doc.png') case 'RDOC': return require('./../../images/rdoc.png') + case 'USDRIF': + return require('./../../images/usdrif.png') case 'RIFP': return require('@rsksmart/rsk-contract-metadata/images/rifpro.png') case 'BPRO': @@ -273,3 +279,12 @@ export const getIconSource = ( return undefined } } + +export const USDRIF_TESTNET = { + decimals: 18, + name: 'RIF US Dollar', + symbol: 'USDRIF', + contractAddress: '0x8dbf326e12a9ff37ed6ddf75ada548c2640a6482', + balance: '0x00', + usdBalance: 0, +} as ITokenWithoutLogo diff --git a/src/subscriptions/rifSockets.ts b/src/subscriptions/rifSockets.ts index 7f73ee8b8..2a6fec6a8 100644 --- a/src/subscriptions/rifSockets.ts +++ b/src/subscriptions/rifSockets.ts @@ -1,6 +1,7 @@ import EventEmitter from 'eventemitter3' import { RIFWallet } from '@rsksmart/rif-wallet-core' import { + ITokenWithBalance, RifWalletServicesFetcher, RifWalletServicesSocket, } from '@rsksmart/rif-wallet-services' @@ -95,12 +96,16 @@ export const rifSockets = ({ } const defaultTokens = getDefaultTokens(chainId) - defaultTokens.forEach(t => { + const defaultTokensWithBalance = defaultTokens.map(t => { const tokenBalance = balances[t.contractAddress] - t.balance = tokenBalance?.balance ?? t.balance - t.usdBalance = tokenBalance?.usdBalance ?? t.usdBalance + return { + ...t, + logo: '', // remove warning + balance: tokenBalance?.balance ?? t.balance, + usdBalance: tokenBalance?.usdBalance ?? t.usdBalance, + } as ITokenWithBalance }) - dispatch(addOrUpdateBalances(defaultTokens)) + dispatch(addOrUpdateBalances(defaultTokensWithBalance)) rifWalletServicesSocket.removeAllListeners()