Changeset View
Changeset View
Standalone View
Standalone View
web/cashtab/src/components/Wallet/Wallet.js
Show First 20 Lines • Show All 173 Lines • ▼ Show 20 Lines | |||||
export const AddrPrefixLabel = styled.span` | export const AddrPrefixLabel = styled.span` | ||||
color: ${props => props.theme.wallet.text.primary} | color: ${props => props.theme.wallet.text.primary} | ||||
margin-right: 4px; | margin-right: 4px; | ||||
`; | `; | ||||
const WalletInfo = () => { | const WalletInfo = () => { | ||||
const ContextValue = React.useContext(WalletContext); | const ContextValue = React.useContext(WalletContext); | ||||
const { wallet, fiatPrice, apiError } = ContextValue; | const { wallet, fiatPrice, apiError, cashtabSettings } = ContextValue; | ||||
let balances; | let balances; | ||||
let parsedTxHistory; | let parsedTxHistory; | ||||
let tokens; | let tokens; | ||||
// use parameters from wallet.state object and not legacy separate parameters, if they are in state | // use parameters from wallet.state object and not legacy separate parameters, if they are in state | ||||
// handle edge case of user with old wallet who has not opened latest Cashtab version yet | // handle edge case of user with old wallet who has not opened latest Cashtab version yet | ||||
// If the wallet object from ContextValue has a `state key`, then check which keys are in the wallet object | // If the wallet object from ContextValue has a `state key`, then check which keys are in the wallet object | ||||
// Else set it as blank | // Else set it as blank | ||||
▲ Show 20 Lines • Show All 49 Lines • ▼ Show 20 Lines | return ( | ||||
</> | </> | ||||
) : ( | ) : ( | ||||
<> | <> | ||||
<BalanceHeader> | <BalanceHeader> | ||||
{formatBalance(balances.totalBalance)} {currency.ticker} | {formatBalance(balances.totalBalance)} {currency.ticker} | ||||
</BalanceHeader> | </BalanceHeader> | ||||
{fiatPrice !== null && !isNaN(balances.totalBalance) && ( | {fiatPrice !== null && !isNaN(balances.totalBalance) && ( | ||||
<BalanceHeaderFiat> | <BalanceHeaderFiat> | ||||
${(balances.totalBalance * fiatPrice).toFixed(2)}{' '} | {cashtabSettings | ||||
USD | ? `${ | ||||
currency.fiatCurrencies[ | |||||
cashtabSettings.fiatCurrency | |||||
].symbol | |||||
} ` | |||||
: '$ '} | |||||
{(balances.totalBalance * fiatPrice).toFixed(2)}{' '} | |||||
{cashtabSettings | |||||
? `${currency.fiatCurrencies[ | |||||
cashtabSettings.fiatCurrency | |||||
].slug.toUpperCase()} ` | |||||
: 'USD'} | |||||
</BalanceHeaderFiat> | </BalanceHeaderFiat> | ||||
)} | )} | ||||
</> | </> | ||||
)} | )} | ||||
{apiError && ( | {apiError && ( | ||||
<> | <> | ||||
<p style={{ color: 'red' }}> | <p style={{ color: 'red' }}> | ||||
<b>An error occurred on our end.</b> | <b>An error occurred on our end.</b> | ||||
▲ Show 20 Lines • Show All 93 Lines • ▼ Show 20 Lines | return ( | ||||
</TabLabel> | </TabLabel> | ||||
<TabLine left={activeTab === 'txHistory'} /> | <TabLine left={activeTab === 'txHistory'} /> | ||||
</Tabs> | </Tabs> | ||||
<TabPane active={activeTab === 'txHistory'}> | <TabPane active={activeTab === 'txHistory'}> | ||||
<TxHistory | <TxHistory | ||||
txs={parsedTxHistory} | txs={parsedTxHistory} | ||||
fiatPrice={fiatPrice} | fiatPrice={fiatPrice} | ||||
fiatCurrency={ | |||||
cashtabSettings && cashtabSettings.fiatCurrency | |||||
? cashtabSettings.fiatCurrency | |||||
: 'usd' | |||||
} | |||||
/> | /> | ||||
</TabPane> | </TabPane> | ||||
<TabPane active={activeTab === 'tokens'}> | <TabPane active={activeTab === 'tokens'}> | ||||
{tokens && tokens.length > 0 ? ( | {tokens && tokens.length > 0 ? ( | ||||
<TokenList | <TokenList | ||||
wallet={wallet} | wallet={wallet} | ||||
tokens={tokens} | tokens={tokens} | ||||
jestBCH={false} | jestBCH={false} | ||||
Show All 32 Lines |