fix: Fixes #361. Restrict user from clicking "Scan" to process tx bef…

…ore gas is calculated

* Add `isEstimatingTxFee` so we can check if all values including `gas` are available
without actually having to calculate the tx fee and incorporate into estimateTxFee method

* Display and disable the "Checking..." button if the `isEstimatingTxFee` returns false (i.e. `gas`
still undefined)

* Note: The bug associated with #361 appears to be Parity Signer-specific. If the user can click "Scan" before the `gas` has been calculated, then when it tries to go to the paritytech/fether/packages/fether-react/src/Send/TxQrCode/TxQrCode.js, where it calls `getRlp()` to get the value for the rlp prop of the QrSigner component, which calls `transactionToRlp(this.tx)` to get the RLP of the unsigned tx that is provided as an argument paritytech/fether/packages/fether-react/src/stores/sendStore.js, it crashes if `this.tx` contains a `gas` property that's undefined.
So we need to prevent the user from being able to click "Scan" before the `gas` property has been determined.
We do this by disabling the button and displaying "Checking..." until `isEstimatingTxFee` returns true, and only then
do we display "Scan" and enable the button

packages/fether-react/src/Send/TxForm/TxForm.js

@@ -105,15 +105,22 @@ class TxForm extends Component {
     return output;
   };
 
-  estimatedTxFee = values => {
+  isEstimatedTxFee = values => {
     if (
-      !values.amount ||
-      !values.gas ||
-      !values.gasPrice ||
-      isNaN(values.amount) ||
-      isNaN(values.gas) ||
-      isNaN(values.gasPrice)
+      values.amount &&
+      values.gas &&
+      values.gasPrice &&
+      !isNaN(values.amount) &&
+      !isNaN(values.gas) &&
+      !isNaN(values.gasPrice)
     ) {
+      return true;
+    }
+
+    return false;
+  };
+  estimatedTxFee = values => {
+    if (!this.isEstimatedTxFee(values)) {
       return null;
     }
 
@@ -303,10 +310,14 @@ class TxForm extends Component {
                               : this.showDetailsAnchor()}
                           </div>
                           <button
-                            disabled={!valid || validating}
+                            disabled={
+                              !valid ||
+                              validating ||
+                              !this.isEstimatedTxFee(values)
+                            }
                             className='button'
                           >
-                            {validating
+                            {validating || !this.isEstimatedTxFee(values)
                               ? 'Checking...'
                               : type === 'signer'
                                 ? 'Scan'
@@ -396,7 +407,7 @@ class TxForm extends Component {
 
       // If the gas hasn't been calculated yet, then we don't show any errors,
       // just wait a bit more
-      if (!this.estimatedTxFee(values)) {
+      if (!this.isEstimatedTxFee(values)) {
         return;
       }