jsx - extract component functions

react/src/components/dashboard/receiveCoin.js

@@ -27,8 +27,12 @@ class ReceiveCoin extends React.Component {
     Store.dispatch(copyCoinAddress(address));
   }
 
+  isBasiliskMode() {
+    return this.props.mode === 'basilisk';
+  }
+
   renderAddressActions(address) {
-    if (this.props.mode === 'basilisk') {
+    if (this.isBasiliskMode()) {
       return (
         <td>
           <span className="label label-default">
@@ -67,6 +71,14 @@ class ReceiveCoin extends React.Component {
     }
   }
 
+  hasNoAmount(address) {
+    return address.amount === 'N/A' || address.amount === 0;
+  }
+
+  hasNoInterest(address) {
+    return address.interest === 'N/A' || address.interest === 0 || !address.interest;
+  }
+
   renderAddressList() {
     if (this.props.addresses &&
         this.props.addresses.public &&
@@ -76,12 +88,10 @@ class ReceiveCoin extends React.Component {
       for (let i = 0; i < this.props.addresses.public.length; i++) {
         let address = this.props.addresses.public[i];
 
-        if (this.props.mode === 'basilisk' &&
-            (address.amount === 'N/A' || address.amount === 0)) {
+        if (this.isBasiliskMode() && this.hasNoAmount(address)) {
           address.amount = this.props.cache && this.props.cache[this.props.coin][address.address] && this.props.cache[this.props.coin][address.address].getbalance.data && this.props.cache[this.props.coin][address.address].getbalance.data.balance ? this.props.cache[this.props.coin][address.address].getbalance.data.balance : 'N/A';
         }
-        if (this.props.mode === 'basilisk' &&
-            (address.interest === 'N/A' || address.interest === 0 || !address.interest)) {
+        if (this.isBasiliskMode() && this.hasNoInterest(address)) {
           address.interest = this.props.cache && this.props.cache[this.props.coin][address.address] && this.props.cache[this.props.coin][address.address].getbalance.data && this.props.cache[this.props.coin][address.address].getbalance.data.interest ? this.props.cache[this.props.coin][address.address].getbalance.data.interest : 'N/A';
         }
 

react/src/components/dashboard/walletsBasiliskConnection.js

@@ -19,9 +19,13 @@ class WalletsBasiliskConnection extends React.Component {
     }
   }
 
+  isBasiliskConnection() {
+    return this.props &&
+      this.props.Dashboard.basiliskConnection;
+  }
+
   render() {
-    if (this.props &&
-        this.props.Dashboard.basiliskConnection) {
+    if (this.isBasiliskConnection()) {
       return (
         <div onKeyDown={ (event) => this.handleKeydown(event) }>
           <div className="modal show" id="RefreshBasiliskConnectionsMdl" aria-hidden="false" role="dialog">

react/src/components/dashboard/walletsBasiliskRefresh.js

@@ -2,9 +2,13 @@ import React from 'react';
 import { translate } from '../../translate/translate';
 
 class WalletsBasiliskRefresh extends React.Component {
+  isBasiliskRefresh() {
+   return this.props &&
+    this.props.Dashboard.basiliskRefresh;
+  }
+
   render() {
-    if (this.props &&
-        this.props.Dashboard.basiliskRefresh) {
+    if (this.isBasiliskRefresh()) {
       return (
         <div id="edexcoin_dashboard_basilisk_refresh_status">
           <div className="col-xs-12 margin-top-20">

react/src/components/dashboard/walletsCacheData.js

@@ -18,15 +18,23 @@ class WalletsCacheData extends React.Component {
     Store.dispatch(toggleViewCacheModal(false));
   }
 
+  hasActiveCoinCache() {
+    return this.props.ActiveCoin.cache;
+  }
+
+  coinsInCache() {
+    return Object.keys(this.props.ActiveCoin.cache).length;
+  }
+
   renderNotariesFetching() {
-    if (!this.props.ActiveCoin.cache) {
+    if (!this.hasActiveCoinCache()) {
       return (
         <div>Fetching cache data...</div>
       );
     } else {
       return (
         <div>
-          <strong>{ Object.keys(this.props.ActiveCoin.cache).length }</strong> coin(s) in cache file
+          <strong>{ this.coinsInCache() }</strong> coin(s) in cache file
         </div>
       );
     }
@@ -127,10 +135,14 @@ class WalletsCacheData extends React.Component {
     }
   }
 
+  hasActiveCoinNotaries() {
+    return this.props.ActiveCoin.notaries &&
+      this.props.ActiveCoin.notaries.notaries &&
+      this.props.ActiveCoin.notaries.notaries.length;
+  }
+
   renderCoinData() {
-    if (this.props.ActiveCoin.notaries &&
-        this.props.ActiveCoin.notaries.notaries &&
-        this.props.ActiveCoin.notaries.notaries.length) {
+    if (this.hasActiveCoinNotaries()) {
       return this.props.ActiveCoin.notaries.notaries.map((node, index) =>
         <TreeNode title={ `Node ${index}` } key={ `node-${index}` }>
           <TreeNode key={ `node-${index}-btc` } title={ `BTC: ${node.BTCaddress}` } />

react/src/components/dashboard/walletsData.js

@@ -507,10 +507,14 @@ class WalletsData extends React.Component {
     }
   }
 
+  hasPublicAdresses() {
+    return this.props.ActiveCoin.addresses &&
+      this.props.ActiveCoin.addresses.public &&
+      this.props.ActiveCoin.addresses.public.length;
+  }
+
   renderAddressAmount() {
-    if (this.props.ActiveCoin.addresses &&
-        this.props.ActiveCoin.addresses.public &&
-        this.props.ActiveCoin.addresses.public.length) {
+    if (this.hasPublicAdresses()) {
       for (let i = 0; i < this.props.ActiveCoin.addresses.public.length; i++) {
         if (this.props.ActiveCoin.addresses.public[i].address === this.state.currentAddress) {
           if (this.props.ActiveCoin.addresses.public[i].amount &&

react/src/components/dashboard/walletsHeader.js

@@ -4,18 +4,26 @@ import { translate } from '../../translate/translate';
 // import Store from '../../store';
 
 class WalletsHeader extends React.Component {
+  hasActiveSection() {
+    return this.props &&
+      this.props.activeSection;
+  }
+
+  isActiveSectionJumblr() {
+    return this.props.activeSection === 'jumblr';
+  }
+
   render() {
-    if (this.props &&
-        this.props.activeSection) {
+    if (this.hasActiveSection()) {
       return (
         <div
           className="page-header page-header-bordered header-easydex margin-bottom-0"
           id="easydex-header-div"
           style={{ backgroundImage: 'url("assets/images/bg/' + this.props.activeSection + '_transparent_header_bg.png")', backgroundRepeat: 'no-repeat', backgroundPosition: '0%' }}>
-          <h1 className={ this.props.activeSection === 'jumblr' ? 'hide' : 'page-title' }>EasyDEX</h1>
+          <h1 className={ this.isActiveSectionJumblr() ? 'hide' : 'page-title' }>EasyDEX</h1>
           <ol className="breadcrumb">
-            <li className={ this.props.activeSection === 'jumblr' ? 'hide' : 'header-easydex-section' }>{ translate('INDEX.DASHBOARD') }</li>
-            <li className={ this.props.activeSection !== 'jumblr' ? 'hide' : 'header-easydex-section' }>
+            <li className={ this.isActiveSectionJumblr() ? 'hide' : 'header-easydex-section' }>{ translate('INDEX.DASHBOARD') }</li>
+            <li className={ !this.isActiveSectionJumblr() ? 'hide' : 'header-easydex-section' }>
               <img src="assets/images/native/jumblr_header_title_logo.png" /><br /> { translate('SIDEBAR.JUMBLR_MOTTO') }
             </li>
           </ol>

react/src/components/dashboard/walletsNative.js

@@ -21,11 +21,15 @@ class WalletsNative extends React.Component {
     }
   }
 
+  isActiveCoinModeNative() {
+    return this.props &&
+      this.props.ActiveCoin &&
+      this.props.ActiveCoin.mode === 'native';
+  }
+
   // <WalletsNativeAlert {...this.props} />
   render() {
-    if (this.props &&
-        this.props.ActiveCoin &&
-        this.props.ActiveCoin.mode === 'native') {
+    if (this.isActiveCoinModeNative()) {
       return (
         <div className="page margin-left-0">
           <div id="section-extcoin" className="padding-top-0">

react/src/components/dashboard/walletsNativeAlert.js

@@ -2,10 +2,14 @@ import React from 'react';
 import { translate } from '../../translate/translate';
 
 class WalletsNativeAlert extends React.Component {
+  hasNoProgress() {
+    return this.props &&
+      this.props.Dashboard &&
+      !this.props.Dashboard.progress;
+  }
+
   render() {
-    if (this.props &&
-        this.props.Dashboard &&
-        !this.props.Dashboard.progress) {
+    if (this.hasNoProgress()) {
       return (
         <div role="alert" className="alert alert-danger alert-dismissible" id="extcoin-wallet-connection-alert">
           <button aria-label="Close" data-dismiss="alert" className="close" type="button">