fix(interest): add btc balance

blockchain · May 27, 2020 · 3911f95 · 3911f95
1 parent 3b36076
commit 3911f95
Show file tree

Hide file tree

Showing 2 changed files with 93 additions and 9 deletions.
diff --git a/...ges/blockchain-wallet-v4-frontend/src/modals/Interest/AccountSummary/template.success.tsx b/...ges/blockchain-wallet-v4-frontend/src/modals/Interest/AccountSummary/template.success.tsx
@@ -27,6 +27,7 @@ import {
   Wrapper
 } from './model'
 
+import { Exchange } from 'core'
 import { LinkDispatchPropsType, OwnProps, SuccessStateType } from '.'
 
 const AccountSummary: React.FC<Props> = props => {
@@ -46,6 +47,21 @@ const AccountSummary: React.FC<Props> = props => {
   const account = accountBalances && accountBalances[coin]
   const lockupPeriod = interestLimits[coin].lockUpDuration / 86400
 
+  const accountBalanceStandard =
+    account &&
+    Exchange.convertCoinToCoin({
+      value: account.balance || 0,
+      coin: 'BTC',
+      baseToStandard: true
+    }).value
+
+  const interestBalanceStandard =
+    account &&
+    Exchange.convertCoinToCoin({
+      value: account.totalInterest || 0,
+      coin: 'BTC',
+      baseToStandard: true
+    }).value
   return (
     <Wrapper>
       <Top>
@@ -73,34 +89,74 @@ const AccountSummary: React.FC<Props> = props => {
         </TopText>
         <Row>
           <Container>
-            <Text color='grey600' size='14px' weight={500}>
+            <Text
+              color='grey600'
+              size='14px'
+              weight={500}
+              style={{ marginBottom: '5px' }}
+            >
               <FormattedMessage
                 id='modals.interest.detailsbalance'
                 defaultMessage='Your {coin} Balance'
                 values={{ coin }}
               />
             </Text>
             {account ? (
-              <FiatDisplay color='grey800' size='20px' weight={600} coin={coin}>
-                {account.balance}
-              </FiatDisplay>
+              <>
+                <FiatDisplay
+                  color='grey800'
+                  size='20px'
+                  weight={600}
+                  coin={coin}
+                >
+                  {account.balance}
+                </FiatDisplay>
+                <Text
+                  color='grey600'
+                  size='14px'
+                  weight={500}
+                  style={{ marginTop: '5px' }}
+                >
+                  {accountBalanceStandard} {coin}
+                </Text>
+              </>
             ) : (
               <FiatDisplay color='grey800' size='20px' weight={600} coin={coin}>
                 0
               </FiatDisplay>
             )}
           </Container>
           <Container>
-            <Text color='grey600' size='14px' weight={500}>
+            <Text
+              color='grey600'
+              size='14px'
+              weight={500}
+              style={{ marginBottom: '5px' }}
+            >
               <FormattedMessage
                 id='modals.interest.totalearned'
                 defaultMessage='Total Interest Earned'
               />
             </Text>
             {account ? (
-              <FiatDisplay color='grey800' size='20px' weight={600} coin={coin}>
-                {account.totalInterest}
-              </FiatDisplay>
+              <>
+                <FiatDisplay
+                  color='grey800'
+                  size='20px'
+                  weight={600}
+                  coin={coin}
+                >
+                  {account.totalInterest}
+                </FiatDisplay>
+                <Text
+                  color='grey600'
+                  size='14px'
+                  weight={500}
+                  style={{ marginTop: '5px' }}
+                >
+                  {interestBalanceStandard} {coin}
+                </Text>
+              </>
             ) : (
               <FiatDisplay color='grey800' size='20px' weight={600} coin={coin}>
                 0

diff --git a/packages/blockchain-wallet-v4-frontend/src/scenes/Interest/SummaryCard/template.success.tsx b/packages/blockchain-wallet-v4-frontend/src/scenes/Interest/SummaryCard/template.success.tsx
@@ -81,6 +81,11 @@ function SummaryCard (props: OwnProps & SuccessStateType): ReactElement {
   }).value
   const totalInterest =
     interestAccountBalance.BTC && interestAccountBalance.BTC.totalInterest
+  const totalInterestStandard = Exchange.convertCoinToCoin({
+    value: totalInterest || 0,
+    coin: 'BTC',
+    baseToStandard: true
+  }).value
   return (
     <DepositBox showInterestInfoBox={showInterestInfoBox}>
       <Row>
@@ -146,6 +151,17 @@ function SummaryCard (props: OwnProps & SuccessStateType): ReactElement {
           >
             {balanceStandard} {coinTicker}
           </Text>
+          <Text
+            size='12px'
+            weight={500}
+            style={{ lineHeight: '1.5', marginTop: '5px' }}
+          >
+            <FormattedMessage
+              id='modals.interest.detailsbalance'
+              defaultMessage='Your {coin} Balance'
+              values={{ coin }}
+            />
+          </Text>
         </AmountColumn>
         <AmountColumn>
           <FiatDisplay
@@ -159,7 +175,19 @@ function SummaryCard (props: OwnProps & SuccessStateType): ReactElement {
           >
             {totalInterest}
           </FiatDisplay>
-          <Text size='12px' weight={500} style={{ lineHeight: '1.5' }}>
+          <Text
+            data-e2e='btcInterest'
+            size='12px'
+            weight={500}
+            style={{ lineHeight: '1.5' }}
+          >
+            {totalInterestStandard} {coinTicker}
+          </Text>
+          <Text
+            size='12px'
+            weight={500}
+            style={{ lineHeight: '1.5', marginTop: '5px' }}
+          >
             <FormattedMessage
               id='scenes.interest.summarycard.totalinterest'
               defaultMessage='Total Interest Earned'