Changeset View
Changeset View
Standalone View
Standalone View
web/cashtab/src/components/Wallet/Wallet.js
| import React from 'react'; | import React from 'react'; | ||||
| import styled from 'styled-components'; | import styled from 'styled-components'; | ||||
| import { Switch } from 'antd'; | import { Switch } from 'antd'; | ||||
| import { LinkOutlined, LoadingOutlined } from '@ant-design/icons'; | import { LinkOutlined, LoadingOutlined } from '@ant-design/icons'; | ||||
| import { WalletContext } from '@utils/context'; | import { WalletContext } from '@utils/context'; | ||||
| import { OnBoarding } from '@components/OnBoarding/OnBoarding'; | import { OnBoarding } from '@components/OnBoarding/OnBoarding'; | ||||
| import { QRCode } from '@components/Common/QRCode'; | import { QRCode } from '@components/Common/QRCode'; | ||||
| import { currency } from '@components/Common/Ticker.js'; | import { currency } from '@components/Common/Ticker.js'; | ||||
| import { Link } from 'react-router-dom'; | import { Link } from 'react-router-dom'; | ||||
| import TokenList from './TokenList'; | import TokenList from './TokenList'; | ||||
| import TxHistory from './TxHistory'; | import TxHistory from './TxHistory'; | ||||
| import { CashLoader } from '@components/Common/CustomIcons'; | import { CashLoader } from '@components/Common/CustomIcons'; | ||||
| import { BalanceHeader } from '@components/Common/BalanceHeader'; | import { BalanceHeader } from '@components/Common/BalanceHeader'; | ||||
| import { | import { BalanceHeaderFiat } from '@components/Common/BalanceHeaderFiat'; | ||||
| LoadingCtn, | import { LoadingCtn, ZeroBalanceHeader } from '@components/Common/Atoms'; | ||||
| BalanceHeaderFiat, | |||||
| ZeroBalanceHeader, | |||||
| } from '@components/Common/Atoms'; | |||||
| export const Tabs = styled.div` | export const Tabs = styled.div` | ||||
| margin: auto; | margin: auto; | ||||
| margin-bottom: 12px; | margin-bottom: 12px; | ||||
| display: inline-block; | display: inline-block; | ||||
| text-align: center; | text-align: center; | ||||
| `; | `; | ||||
| export const TabLabel = styled.button` | export const TabLabel = styled.button` | ||||
| ▲ Show 20 Lines • Show All 215 Lines • ▼ Show 20 Lines | return ( | ||||
| </> | </> | ||||
| ) : ( | ) : ( | ||||
| <> | <> | ||||
| <BalanceHeader | <BalanceHeader | ||||
| balance={balances.totalBalance} | balance={balances.totalBalance} | ||||
| ticker={currency.ticker} | ticker={currency.ticker} | ||||
| ></BalanceHeader> | ></BalanceHeader> | ||||
| {fiatPrice !== null && !isNaN(balances.totalBalance) && ( | {fiatPrice !== null && !isNaN(balances.totalBalance) && ( | ||||
| <BalanceHeaderFiat> | <BalanceHeaderFiat | ||||
| {cashtabSettings | balance={balances.totalBalance} | ||||
| ? `${ | settings={cashtabSettings} | ||||
| currency.fiatCurrencies[ | fiatPrice={fiatPrice} | ||||
| cashtabSettings.fiatCurrency | /> | ||||
| ].symbol | |||||
| } ` | |||||
| : '$ '} | |||||
| {(balances.totalBalance * fiatPrice).toFixed(2)}{' '} | |||||
| {cashtabSettings | |||||
| ? `${currency.fiatCurrencies[ | |||||
| cashtabSettings.fiatCurrency | |||||
| ].slug.toUpperCase()} ` | |||||
| : 'USD'} | |||||
| </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> | ||||
| <br></br> Re-establishing connection... | <br></br> Re-establishing connection... | ||||
| ▲ Show 20 Lines • Show All 145 Lines • Show Last 20 Lines | |||||