diff --git a/src/ui/component/walletBalance/index.js b/src/ui/component/walletBalance/index.js index 6e136f1bd..68130b405 100644 --- a/src/ui/component/walletBalance/index.js +++ b/src/ui/component/walletBalance/index.js @@ -1,9 +1,19 @@ import { connect } from 'react-redux'; -import { selectBalance } from 'lbry-redux'; +import { + selectBalance, + selectTotalBalance, + selectClaimsBalance, + selectSupportsBalance, + selectTipsBalance, +} from 'lbry-redux'; import WalletBalance from './view'; const select = state => ({ balance: selectBalance(state), + totalBalance: selectTotalBalance(state), + claimsBalance: selectClaimsBalance(state), + supportsBalance: selectSupportsBalance(state), + tipsBalance: selectTipsBalance(state), }); export default connect( diff --git a/src/ui/component/walletBalance/view.jsx b/src/ui/component/walletBalance/view.jsx index 55ef017a1..9ab46aac6 100644 --- a/src/ui/component/walletBalance/view.jsx +++ b/src/ui/component/walletBalance/view.jsx @@ -5,10 +5,14 @@ import BalanceBackground from './balance-background.png'; type Props = { balance: number, + totalBalance: number, + claimsBalance: number, + supportsBalance: number, + tipsBalance: number, }; const WalletBalance = (props: Props) => { - const { balance } = props; + const { balance, totalBalance, claimsBalance, supportsBalance, tipsBalance } = props; return (
{ {(balance || balance === 0) && } + {tipsBalance > 0 && ( +
+ Locked in Tips: +
+ )} + {claimsBalance > 0 && ( +
+ Locked in claims: +
+ )} + {supportsBalance > 0 && ( +
+ Locked in supports: +
+ )} + {totalBalance > 0 && ( +
+ Total account value: +
+ )}
); };