Don't query chain in Signer, use Redux isTest

js/src/views/Signer/components/Account/Account.js

@@ -25,7 +25,7 @@ export default class Account extends Component {
   static propTypes = {
     className: PropTypes.string,
     address: PropTypes.string.isRequired,
-    chain: PropTypes.string.isRequired,
+    isTest: PropTypes.bool.isRequired,
     balance: PropTypes.object // eth BigNumber, not required since it mght take time to fetch
   };
 
@@ -51,11 +51,13 @@ export default class Account extends Component {
   }
 
   render () {
-    const { address, chain, className } = this.props;
+    const { address, isTest, className } = this.props;
 
     return (
       <div className={ `${styles.acc} ${className}` }>
-        <AccountLink address={ address } chain={ chain }>
+        <AccountLink
+          address={ address }
+          isTest={ isTest }>
           <IdentityIcon
             center
             address={ address } />
@@ -74,19 +76,23 @@ export default class Account extends Component {
   }
 
   renderName () {
-    const { address } = this.props;
+    const { address, isTest } = this.props;
     const name = <IdentityName address={ address } empty />;
 
     if (!name) {
       return (
-        <AccountLink address={ address } chain={ this.props.chain }>
+        <AccountLink
+          address={ address }
+          isTest={ isTest }>
           [{ this.shortAddress(address) }]
         </AccountLink>
       );
     }
 
     return (
-      <AccountLink address={ address } chain={ this.props.chain } >
+      <AccountLink
+        address={ address }
+        isTest={ isTest } >
         <span>
           <span className={ styles.name }>{ name }</span>
           <span className={ styles.address }>[{ this.tinyAddress(address) }]</span>

js/src/views/Signer/components/Account/AccountLink/AccountLink.js

@@ -21,7 +21,7 @@ import styles from './AccountLink.css';
 
 export default class AccountLink extends Component {
   static propTypes = {
-    chain: PropTypes.string.isRequired,
+    isTest: PropTypes.bool.isRequired,
     address: PropTypes.string.isRequired,
     className: PropTypes.string,
     children: PropTypes.node
@@ -32,15 +32,15 @@ export default class AccountLink extends Component {
   };
 
   componentWillMount () {
-    const { address, chain } = this.props;
+    const { address, isTest } = this.props;
 
-    this.updateLink(address, chain);
+    this.updateLink(address, isTest);
   }
 
   componentWillReceiveProps (nextProps) {
-    const { address, chain } = nextProps;
+    const { address, isTest } = nextProps;
 
-    this.updateLink(address, chain);
+    this.updateLink(address, isTest);
   }
 
   render () {
@@ -56,8 +56,8 @@ export default class AccountLink extends Component {
     );
   }
 
-  updateLink (address, chain) {
+  updateLink (address, isTest) {
-    const link = addressLink(address, chain === 'morden' || chain === 'testnet');
+    const link = addressLink(address, isTest);
 
     this.setState({
       link

js/src/views/Signer/components/RequestFinishedWeb3/RequestFinishedWeb3.js

@@ -31,14 +31,16 @@ export default class RequestFinishedWeb3 extends Component {
     msg: PropTypes.string,
     status: PropTypes.string,
     error: PropTypes.string,
-    className: PropTypes.string
+    className: PropTypes.string,
+    isTest: PropTypes.bool.isRequired
   }
 
   render () {
-    const { payload, id, result, msg, status, error, date, className } = this.props;
+    const { payload, id, result, msg, status, error, date, className, isTest } = this.props;
 
     if (payload.sign) {
       const { sign } = payload;
+
       return (
         <SignRequest
           className={ className }
@@ -49,12 +51,14 @@ export default class RequestFinishedWeb3 extends Component {
           msg={ msg }
           status={ status }
           error={ error }
+          isTest={ isTest }
           />
       );
     }
 
     if (payload.transaction) {
       const { transaction } = payload;
+
       return (
         <TransactionFinished
           className={ className }
@@ -69,6 +73,7 @@ export default class RequestFinishedWeb3 extends Component {
           date={ date }
           status={ status }
           error={ error }
+          isTest={ isTest }
         />
       );
     }

js/src/views/Signer/components/RequestPendingWeb3/RequestPendingWeb3.js

@@ -30,7 +30,8 @@ export default class RequestPendingWeb3 extends Component {
       PropTypes.shape({ transaction: PropTypes.object.isRequired }),
       PropTypes.shape({ sign: PropTypes.object.isRequired })
     ]).isRequired,
-    className: PropTypes.string
+    className: PropTypes.string,
+    isTest: PropTypes.bool.isRequired
   };
 
   onConfirm = data => {
@@ -41,10 +42,11 @@ export default class RequestPendingWeb3 extends Component {
   };
 
   render () {
-    const { payload, id, className, isSending, date, onReject } = this.props;
+    const { payload, id, className, isSending, date, onReject, isTest } = this.props;
 
     if (payload.sign) {
       const { sign } = payload;
+
       return (
         <SignRequest
           className={ className }
@@ -55,12 +57,14 @@ export default class RequestPendingWeb3 extends Component {
           id={ id }
           address={ sign.address }
           hash={ sign.hash }
+          isTest={ isTest }
           />
       );
     }
 
     if (payload.transaction) {
       const { transaction } = payload;
+
       return (
         <TransactionPending
           className={ className }
@@ -75,6 +79,7 @@ export default class RequestPendingWeb3 extends Component {
           to={ transaction.to }
           value={ transaction.value }
           date={ date }
+          isTest={ isTest }
           />
       );
     }

js/src/views/Signer/components/SignRequest/SignRequest.js

@@ -39,24 +39,15 @@ export default class SignRequest extends Component {
     onReject: PropTypes.func,
     status: PropTypes.string,
     className: PropTypes.string,
-    chain: nullable(PropTypes.object),
+    isTest: PropTypes.bool.isRequired,
     balance: nullable(PropTypes.object)
   };
 
   state = {
-    chain: null,
     balance: null
   }
 
   componentWillMount () {
-    this.context.api.parity.netChain()
-      .then((chain) => {
-        this.setState({ chain });
-      })
-      .catch((err) => {
-        console.error('could not fetch chain', err);
-      });
-
     this.context.api.eth.getBalance(this.props.address)
       .then((balance) => {
         this.setState({ balance });
@@ -68,6 +59,7 @@ export default class SignRequest extends Component {
 
   render () {
     const { className } = this.props;
+
     return (
       <div className={ `${styles.container} ${className || ''}` }>
         { this.renderDetails() }
@@ -77,15 +69,20 @@ export default class SignRequest extends Component {
   }
 
   renderDetails () {
-    const { address, hash } = this.props;
+    const { address, hash, isTest } = this.props;
-    const { balance, chain } = this.state;
+    const { balance } = this.state;
 
-    if (!balance || !chain) return (<div />);
+    if (!balance) {
+      return <div />;
+    }
 
     return (
       <div className={ styles.signDetails }>
         <div className={ styles.address }>
-          <Account address={ address } balance={ balance } chain={ chain } />
+          <Account
+            address={ address }
+            balance={ balance }
+            isTest={ isTest } />
         </div>
         <div className={ styles.info } title={ hash }>
           <p>Dapp is requesting to sign arbitrary transaction using this account.</p>
@@ -100,15 +97,17 @@ export default class SignRequest extends Component {
 
     if (isFinished) {
       if (status === 'confirmed') {
-        const { hash } = this.props;
+        const { hash, isTest } = this.props;
-        const { chain } = this.state;
 
         return (
           <div className={ styles.actions }>
             <span className={ styles.isConfirmed }>Confirmed</span>
             <div>
               Transaction hash:
-              <TxHashLink chain={ chain } txHash={ hash } className={ styles.txHash } />
+              <TxHashLink
+                isTest={ isTest }
+                txHash={ hash }
+                className={ styles.txHash } />
             </div>
           </div>
         );

js/src/views/Signer/components/TransactionFinished/TransactionFinished.js

@@ -47,13 +47,12 @@ export default class TransactionFinished extends Component {
     txHash: PropTypes.string, // undefined if transacation is rejected
     className: PropTypes.string,
     data: PropTypes.string,
-    chain: nullable(PropTypes.object),
+    isTest: PropTypes.bool.isRequired,
     fromBalance: nullable(PropTypes.object),
     toBalance: nullable(PropTypes.object)
   };
 
   state = {
-    chain: null,
     fromBalance: null,
     toBalance: null
   };
@@ -64,14 +63,6 @@ export default class TransactionFinished extends Component {
     const totalValue = tUtil.getTotalValue(fee, value);
     this.setState({ totalValue });
 
-    this.context.api.parity.netChain()
-      .then((chain) => {
-        this.setState({ chain });
-      })
-      .catch((err) => {
-        console.error('could not fetch chain', err);
-      });
-
     this.fetchBalance(from, 'fromBalance');
     if (to) {
       this.fetchBalance(to, 'toBalance');
@@ -79,8 +70,9 @@ export default class TransactionFinished extends Component {
   }
 
   render () {
-    const { chain, fromBalance, toBalance } = this.state;
+    const { fromBalance, toBalance } = this.state;
-    if (!chain || !fromBalance || !toBalance) {
+
+    if (!fromBalance || !toBalance) {
       return (
         <div className={ `${styles.container} ${className}` }>
           <CircularProgress size={ 60 } />
@@ -130,16 +122,19 @@ export default class TransactionFinished extends Component {
   }
 
   renderTxHash () {
-    const { txHash } = this.props;
+    const { txHash, isTest } = this.props;
-    const { chain } = this.state;
+
-    if (!txHash || !chain) {
+    if (!txHash) {
       return;
     }
 
     return (
       <div>
         Transaction hash:
-        <TxHashLink chain={ chain } txHash={ txHash } className={ styles.txHash } />
+        <TxHashLink
+          isTest={ isTest }
+          txHash={ txHash }
+          className={ styles.txHash } />
       </div>
     );
   }

js/src/views/Signer/components/TransactionMainDetails/TransactionMainDetails.js

@@ -30,7 +30,7 @@ export default class TransactionMainDetails extends Component {
     fromBalance: PropTypes.object, // eth BigNumber, not required since it might take time to fetch
     value: PropTypes.object.isRequired, // wei hex
     totalValue: PropTypes.object.isRequired, // wei BigNumber
-    chain: PropTypes.string.isRequired,
+    isTest: PropTypes.isTest.isRequired,
     to: PropTypes.string, // undefined if it's a contract
     toBalance: PropTypes.object, // eth BigNumber - undefined if it's a contract or until it's fetched
     className: PropTypes.string,
@@ -39,11 +39,13 @@ export default class TransactionMainDetails extends Component {
 
   componentWillMount () {
     const { value, totalValue } = this.props;
+
     this.updateDisplayValues(value, totalValue);
   }
 
   componentWillReceiveProps (nextProps) {
     const { value, totalValue } = nextProps;
+
     this.updateDisplayValues(value, totalValue);
   }
 
@@ -59,6 +61,7 @@ export default class TransactionMainDetails extends Component {
 
   render () {
     const { className, children } = this.props;
+
     return (
       <div className={ className }>
         { this.renderTransfer() }
@@ -69,7 +72,8 @@ export default class TransactionMainDetails extends Component {
   }
 
   renderTransfer () {
-    const { from, fromBalance, to, toBalance, chain } = this.props;
+    const { from, fromBalance, to, toBalance, isTest } = this.props;
+
     if (!to) {
       return;
     }
@@ -78,7 +82,10 @@ export default class TransactionMainDetails extends Component {
       <div className={ styles.transaction }>
         <div className={ styles.from }>
           <div className={ styles.account }>
-            <Account address={ from } balance={ fromBalance } chain={ chain } />
+            <Account
+              address={ from }
+              balance={ fromBalance }
+              isTest={ isTest } />
           </div>
         </div>
         <div className={ styles.tx }>
@@ -88,7 +95,10 @@ export default class TransactionMainDetails extends Component {
         </div>
         <div className={ styles.to }>
           <div className={ styles.account }>
-            <Account address={ to } balance={ toBalance } chain={ chain } />
+            <Account
+              address={ to }
+              balance={ toBalance }
+              isTest={ isTest } />
           </div>
         </div>
       </div>
@@ -96,15 +106,20 @@ export default class TransactionMainDetails extends Component {
   }
 
   renderContract () {
-    const { from, fromBalance, to, chain } = this.props;
+    const { from, fromBalance, to, isTest } = this.props;
+
     if (to) {
       return;
     }
+
     return (
       <div className={ styles.transaction }>
         <div className={ styles.from }>
           <div className={ styles.account }>
-            <Account address={ from } balance={ fromBalance } chain={ chain } />
+            <Account
+              address={ from }
+              balance={ fromBalance }
+              isTest={ isTest } />
           </div>
         </div>
         <div className={ styles.tx }>
@@ -126,6 +141,7 @@ export default class TransactionMainDetails extends Component {
   renderValue () {
     const { id } = this.props;
     const { valueDisplay, valueDisplayWei } = this.state;
+
     return (
       <div>
         <div
@@ -147,6 +163,7 @@ export default class TransactionMainDetails extends Component {
   renderTotalValue () {
     const { id } = this.props;
     const { totalValueDisplay, totalValueDisplayWei, feeEth } = this.state;
+
     return (
       <div>
         <div
@@ -164,5 +181,4 @@ export default class TransactionMainDetails extends Component {
       </div>
     );
   }
-
 }

js/src/views/Signer/components/TransactionPending/TransactionPending.js

@@ -16,7 +16,6 @@
 
 import React, { Component, PropTypes } from 'react';
 
-import CircularProgress from 'material-ui/CircularProgress';
 import TransactionMainDetails from '../TransactionMainDetails';
 import TransactionPendingForm from '../TransactionPendingForm';
 import TransactionSecondaryDetails from '../TransactionSecondaryDetails';
@@ -43,7 +42,8 @@ export default class TransactionPending extends Component {
     onConfirm: PropTypes.func.isRequired,
     onReject: PropTypes.func.isRequired,
     isSending: PropTypes.bool.isRequired,
-    className: PropTypes.string
+    className: PropTypes.string,
+    isTest: PropTypes.bool.isRequired
   };
 
   static defaultProps = {
@@ -51,7 +51,6 @@ export default class TransactionPending extends Component {
   };
 
   state = {
-    chain: null,
     fromBalance: null,
     toBalance: null
   };
@@ -64,28 +63,12 @@ export default class TransactionPending extends Component {
     const gasToDisplay = tUtil.getGasDisplay(gas);
     this.setState({ gasPriceEthmDisplay, totalValue, gasToDisplay });
 
-    this.context.api.parity.netChain()
-      .then((chain) => {
-        this.setState({ chain });
-      })
-      .catch((err) => {
-        console.error('could not fetch chain', err);
-      });
-
     const { from, to } = this.props;
     this.fetchBalance(from, 'fromBalance');
     if (to) this.fetchBalance(to, 'toBalance');
   }
 
   render () {
-    if (!this.state.chain) {
-      return (
-        <div className={ `${styles.container} ${className}` }>
-          <CircularProgress size={ 60 } />
-        </div>
-      );
-    }
-
     const { totalValue, gasPriceEthmDisplay, gasToDisplay } = this.state;
     const { className, id, date, data, from } = this.props;
 

js/src/views/Signer/components/TransactionSecondaryDetails/TransactionSecondaryDetails.js

@@ -59,10 +59,13 @@ export default class TransactionSecondaryDetails extends Component {
   }
 
   renderGasPrice () {
-    if (!this.props.gasPriceEthmDisplay && !this.props.gasToDisplay) return null;
+    if (!this.props.gasPriceEthmDisplay && !this.props.gasToDisplay) {
+      return null;
+    }
 
     const { id } = this.props;
     const { gasPriceEthmDisplay, gasToDisplay } = this.props;
+
     return (
       <div
         data-tip
@@ -83,11 +86,14 @@ export default class TransactionSecondaryDetails extends Component {
   }
 
   renderData () {
-    if (!this.props.data) return null;
+    if (!this.props.data) {
+      return null;
+    }
 
     const { data, id } = this.props;
     let dataToDisplay = this.noData() ? 'no data' : tUtil.getShortData(data);
     const noDataClass = this.noData() ? styles.noData : '';
+
     return (
       <div
         className={ `${styles.data} ${noDataClass}` }

js/src/views/Signer/components/TxHashLink/TxHashLink.js

@@ -22,17 +22,17 @@ export default class TxHashLink extends Component {
 
   static propTypes = {
     txHash: PropTypes.string.isRequired,
-    chain: PropTypes.string.isRequired,
+    isTest: PropTypes.bool.isRequired,
     children: PropTypes.node,
     className: PropTypes.string
   }
 
   render () {
-    const { children, txHash, className, chain } = this.props;
+    const { children, txHash, className, isTest } = this.props;
 
     return (
       <a
-        href={ txLink(txHash, chain === 'morden' || chain === 'testnet') }
+        href={ txLink(txHash, isTest) }
         target='_blank'
         className={ className }>
         { children || txHash }

js/src/views/Signer/containers/Embedded/embedded.js

@@ -35,7 +35,8 @@ class Embedded extends Component {
     actions: PropTypes.shape({
       startConfirmRequest: PropTypes.func.isRequired,
       startRejectRequest: PropTypes.func.isRequired
-    }).isRequired
+    }).isRequired,
+    isTest: PropTypes.bool.isRequired
   };
 
   render () {
@@ -70,7 +71,7 @@ class Embedded extends Component {
   }
 
   renderPending = (data) => {
-    const { actions } = this.props;
+    const { actions, isTest } = this.props;
     const { payload, id, isSending, date } = data;
 
     return (
@@ -83,6 +84,7 @@ class Embedded extends Component {
         id={ id }
         payload={ payload }
         date={ date }
+        isTest={ isTest }
       />
     );
   }
@@ -93,11 +95,13 @@ class Embedded extends Component {
 }
 
 function mapStateToProps (state) {
+  const { isTest } = state.nodeStatus;
   const { actions, signer } = state;
 
   return {
     actions,
-    signer
+    signer,
+    isTest
   };
 }
 

js/src/views/Signer/containers/RequestsPage/RequestsPage.js

@@ -35,7 +35,8 @@ class RequestsPage extends Component {
     actions: PropTypes.shape({
       startConfirmRequest: PropTypes.func.isRequired,
       startRejectRequest: PropTypes.func.isRequired
-    }).isRequired
+    }).isRequired,
+    isTest: PropTypes.bool.isRequired
   };
 
   render () {
@@ -96,7 +97,7 @@ class RequestsPage extends Component {
   }
 
   renderPending = (data) => {
-    const { actions } = this.props;
+    const { actions, isTest } = this.props;
     const { payload, id, isSending, date } = data;
 
     return (
@@ -109,11 +110,13 @@ class RequestsPage extends Component {
         id={ id }
         payload={ payload }
         date={ date }
+        isTest={ isTest }
       />
     );
   }
 
   renderFinished = (data) => {
+    const { isTest } = this.props;
     const { payload, id, result, msg, status, error, date } = data;
 
     return (
@@ -127,6 +130,7 @@ class RequestsPage extends Component {
         error={ error }
         payload={ payload }
         date={ date }
+        isTest={ isTest }
         />
     );
   }
@@ -143,7 +147,14 @@ class RequestsPage extends Component {
 }
 
 function mapStateToProps (state) {
-  return state;
+  const { isTest } = state.nodeStatus;
+  const { actions, signer } = state;
+
+  return {
+    actions,
+    signer,
+    isTest
+  };
 }
 
 function mapDispatchToProps (dispatch) {