Don't pop-up notifications after network switch (#4076)

* Better notifications

* Don't pollute with notifs if switched networks

* Better connection close/open events / No more notifs on change network

* PR Grumbles

* Add close and open events to HTTP // Add tests

* Fix tests

* WIP Signer Fix

* Fix Signer // Better reconnection handling

* PR Grumbles

* PR Grumbles

* Fixes wrong fetching of balances + Notifications

* Secure API WIP

* Updated Secure API Connection + Status

* Linting

* Linting

* Updated Secure API Logic

* Proper handling of token updates // Fixing poping notifications

* PR Grumbles

* PR Grumbles

* Fixing tests

js/src/views/Application/Status/status.js

@@ -59,6 +59,10 @@ class Status extends Component {
   renderConsensus () {
     const { upgradeStore } = this.props;
 
+    if (!upgradeStore || !upgradeStore.consensusCapability) {
+      return null;
+    }
+
     if (upgradeStore.consensusCapability === 'capable') {
       return (
         <div>
@@ -67,7 +71,9 @@ class Status extends Component {
             defaultMessage='Capable' />
         </div>
       );
-    } else if (upgradeStore.consensusCapability.capableUntil) {
+    }
+
+    if (upgradeStore.consensusCapability.capableUntil) {
       return (
         <div>
           <FormattedMessage
@@ -78,7 +84,9 @@ class Status extends Component {
             } } />
         </div>
       );
-    } else if (upgradeStore.consensusCapability.incapableSince) {
+    }
+
+    if (upgradeStore.consensusCapability.incapableSince) {
       return (
         <div>
           <FormattedMessage

js/src/views/Connection/connection.js

@@ -41,9 +41,9 @@ class Connection extends Component {
   }
 
   render () {
-    const { isConnected, needsToken } = this.props;
+    const { isConnecting, isConnected, needsToken } = this.props;
 
-    if (isConnected) {
+    if (!isConnecting && isConnected) {
       return null;
     }
 

js/src/views/Settings/Parity/parity.js

@@ -51,7 +51,7 @@ export default class Parity extends Component {
     Object.keys(LOG_KEYS).map((logKey) => {
       const log = LOG_KEYS[logKey];
 
-      const logger = LogLevel.getLogger(log.path);
+      const logger = LogLevel.getLogger(log.key);
       const level = logger.getLevel();
 
       nextState[logKey] = { level, log };
@@ -133,11 +133,11 @@ export default class Parity extends Component {
 
     return Object.keys(logLevels).map((logKey) => {
       const { level, log } = logLevels[logKey];
-      const { path, desc } = log;
+      const { key, desc } = log;
 
       const onChange = (_, index) => {
         const nextLevel = Object.values(selectValues)[index].value;
-        LogLevel.getLogger(path).setLevel(nextLevel);
+        LogLevel.getLogger(key).setLevel(nextLevel);
         this.loadLogLevels();
       };
 

js/src/views/Status/components/MiningSettings/miningSettings.js

@@ -37,6 +37,14 @@ export default class MiningSettings extends Component {
     const { nodeStatus } = this.props;
     const { coinbase, defaultExtraData, extraData, gasFloorTarget, minGasPrice } = nodeStatus;
 
+    const extradata = extraData
+      ? decodeExtraData(extraData)
+      : '';
+
+    const defaultExtradata = defaultExtraData
+      ? decodeExtraData(defaultExtraData)
+      : '';
+
     return (
       <div { ...this._testInherit() }>
         <ContainerTitle title='mining settings' />
@@ -53,9 +61,9 @@ export default class MiningSettings extends Component {
         <Input
           label='extradata'
           hint='extra data for mined blocks'
-          value={ decodeExtraData(extraData) }
+          value={ extradata }
           onSubmit={ this.onExtraDataChange }
-          defaultValue={ decodeExtraData(defaultExtraData) }
+          defaultValue={ defaultExtradata }
           allowCopy
           floatCopy
           { ...this._test('extra-data') }

js/src/views/Status/components/Status/status.js

@@ -95,9 +95,15 @@ export default class Status extends Component {
 
   renderSettings () {
     const { nodeStatus } = this.props;
-    const { rpcSettings, netPeers } = nodeStatus;
+    const { rpcSettings, netPeers, netPort = '' } = nodeStatus;
     const peers = `${netPeers.active}/${netPeers.connected}/${netPeers.max}`;
 
+    if (!rpcSettings) {
+      return null;
+    }
+
+    const rpcPort = rpcSettings.port || '';
+
     return (
       <div { ...this._test('settings') }>
         <ContainerTitle title='network settings' />
@@ -121,7 +127,7 @@ export default class Status extends Component {
               allowCopy
               readOnly
               label='network port'
-              value={ nodeStatus.netPort.toString() }
+              value={ netPort.toString() }
               { ...this._test('network-port') } />
           </div>
         </div>
@@ -146,7 +152,7 @@ export default class Status extends Component {
               allowCopy
               readOnly
               label='rpc port'
-              value={ rpcSettings.port.toString() }
+              value={ rpcPort.toString() }
               { ...this._test('rpc-port') } />
           </div>
         </div>