Show/Hide Fiat on Testnets based on User Preference (#6153)

4 files changed, 79 insertions, 14 deletions

diff --git a/ui/app/components/send/account-list-item/account-list-item.component.js b/ui/app/components/send/account-list-item/account-list-item.component.js
index 665383e58..0420af46b 100644
--- a/ui/app/components/send/account-list-item/account-list-item.component.js
+++ b/ui/app/components/send/account-list-item/account-list-item.component.js
@@ -19,8 +19,13 @@ export default class AccountListItem extends Component {
     handleClick: PropTypes.func,
     icon: PropTypes.node,
     balanceIsCached: PropTypes.bool,
+    showFiat: PropTypes.bool,
   };
 
+  static defaultProps = {
+    showFiat: true,
+  }
+
   static contextTypes = {
     t: PropTypes.func,
   };
@@ -34,6 +39,7 @@ export default class AccountListItem extends Component {
       handleClick,
       icon = null,
       balanceIsCached,
+      showFiat,
     } = this.props
 
     const { name, address, balance } = account || {}
@@ -83,11 +89,15 @@ export default class AccountListItem extends Component {
                   balanceIsCached ? <span className="account-list-item__cached-star">*</span> : null
                 }
               </div>
-              <UserPreferencedCurrencyDisplay
-                type={SECONDARY}
-                value={balance}
-                hideTitle={true}
-              />
+              {
+                showFiat && (
+                  <UserPreferencedCurrencyDisplay
+                    type={SECONDARY}
+                    value={balance}
+                    hideTitle={true}
+                  />
+                )
+              }
             </div>
           </Tooltip>
         )
diff --git a/ui/app/components/send/account-list-item/account-list-item.container.js b/ui/app/components/send/account-list-item/account-list-item.container.js
index 03a60be67..c045ef14f 100644
--- a/ui/app/components/send/account-list-item/account-list-item.container.js
+++ b/ui/app/components/send/account-list-item/account-list-item.container.js
@@ -5,17 +5,23 @@ import {
     getNativeCurrency,
 } from '../send.selectors.js'
 import {
+  getIsMainnet,
   isBalanceCached,
+  preferencesSelector,
 } from '../../../selectors'
 import AccountListItem from './account-list-item.component'
 
 export default connect(mapStateToProps)(AccountListItem)
 
 function mapStateToProps (state) {
+  const { showFiatInTestnets } = preferencesSelector(state)
+  const isMainnet = getIsMainnet(state)
+
   return {
     conversionRate: getConversionRate(state),
     currentCurrency: getCurrentCurrency(state),
     nativeCurrency: getNativeCurrency(state),
     balanceIsCached: isBalanceCached(state),
+    showFiat: (isMainnet || !!showFiatInTestnets),
   }
 }
diff --git a/ui/app/components/send/account-list-item/tests/account-list-item-component.test.js b/ui/app/components/send/account-list-item/tests/account-list-item-component.test.js
index f2ddb73c0..2bd2ce0c5 100644
--- a/ui/app/components/send/account-list-item/tests/account-list-item-component.test.js
+++ b/ui/app/components/send/account-list-item/tests/account-list-item-component.test.js
@@ -126,9 +126,23 @@ describe('AccountListItem Component', function () {
       )
     })
 
+    it('should only render one CurrencyDisplay if showFiat is false', () => {
+      wrapper.setProps({ showFiat: false, displayBalance: true })
+      assert.equal(wrapper.find(UserPreferencedCurrencyDisplay).length, 1)
+      assert.deepEqual(
+        wrapper.find(UserPreferencedCurrencyDisplay).at(0).props(),
+        {
+          type: 'PRIMARY',
+          value: 'mockBalance',
+          hideTitle: true,
+        }
+      )
+    })
+
     it('should not render a CurrencyDisplay if displayBalance is false', () => {
       wrapper.setProps({ displayBalance: false })
       assert.equal(wrapper.find(UserPreferencedCurrencyDisplay).length, 0)
     })
+
   })
 })
diff --git a/ui/app/components/send/account-list-item/tests/account-list-item-container.test.js b/ui/app/components/send/account-list-item/tests/account-list-item-container.test.js
index 8c22bc8f8..662880aa0 100644
--- a/ui/app/components/send/account-list-item/tests/account-list-item-container.test.js
+++ b/ui/app/components/send/account-list-item/tests/account-list-item-container.test.js
@@ -11,12 +11,16 @@ proxyquire('../account-list-item.container.js', {
     },
   },
   '../send.selectors.js': {
-    getConversionRate: (s) => `mockConversionRate:${s}`,
-    getCurrentCurrency: (s) => `mockCurrentCurrency:${s}`,
-    getNativeCurrency: (s) => `mockNativeCurrency:${s}`,
+    getConversionRate: () => `mockConversionRate`,
+    getCurrentCurrency: () => `mockCurrentCurrency`,
+    getNativeCurrency: () => `mockNativeCurrency`,
   },
   '../../../selectors.js': {
-    isBalanceCached: (s) => `mockBalanceIsCached:${s}`,
+    isBalanceCached: () => `mockBalanceIsCached`,
+    preferencesSelector: ({ showFiatInTestnets }) => ({
+      showFiatInTestnets,
+    }),
+    getIsMainnet: ({ isMainnet }) => isMainnet,
   },
 })
 
@@ -25,11 +29,42 @@ describe('account-list-item container', () => {
   describe('mapStateToProps()', () => {
 
     it('should map the correct properties to props', () => {
-      assert.deepEqual(mapStateToProps('mockState'), {
-        conversionRate: 'mockConversionRate:mockState',
-        currentCurrency: 'mockCurrentCurrency:mockState',
-        nativeCurrency: 'mockNativeCurrency:mockState',
-        balanceIsCached: 'mockBalanceIsCached:mockState',
+      assert.deepEqual(mapStateToProps({ isMainnet: true, showFiatInTestnets: false }), {
+        conversionRate: 'mockConversionRate',
+        currentCurrency: 'mockCurrentCurrency',
+        nativeCurrency: 'mockNativeCurrency',
+        balanceIsCached: 'mockBalanceIsCached',
+        showFiat: true,
+      })
+    })
+
+    it('should map the correct properties to props when in mainnet and showFiatInTestnet is true', () => {
+      assert.deepEqual(mapStateToProps({ isMainnet: true, showFiatInTestnets: true }), {
+        conversionRate: 'mockConversionRate',
+        currentCurrency: 'mockCurrentCurrency',
+        nativeCurrency: 'mockNativeCurrency',
+        balanceIsCached: 'mockBalanceIsCached',
+        showFiat: true,
+      })
+    })
+
+    it('should map the correct properties to props when not in mainnet and showFiatInTestnet is true', () => {
+      assert.deepEqual(mapStateToProps({ isMainnet: false, showFiatInTestnets: true }), {
+        conversionRate: 'mockConversionRate',
+        currentCurrency: 'mockCurrentCurrency',
+        nativeCurrency: 'mockNativeCurrency',
+        balanceIsCached: 'mockBalanceIsCached',
+        showFiat: true,
+      })
+    })
+
+    it('should map the correct properties to props when not in mainnet and showFiatInTestnet is false', () => {
+      assert.deepEqual(mapStateToProps({ isMainnet: false, showFiatInTestnets: false }), {
+        conversionRate: 'mockConversionRate',
+        currentCurrency: 'mockCurrentCurrency',
+        nativeCurrency: 'mockNativeCurrency',
+        balanceIsCached: 'mockBalanceIsCached',
+        showFiat: false,
       })
     })