Fix async state updates

Fixes #39
Fixes #41

app/components/Receive.js

@@ -1,5 +1,5 @@
 /* eslint-disable react/prop-types */
-import React, { Component, useState } from 'react';
+import React, { Component, useState, useEffect } from 'react';
 import { Tab, Tabs, TabList, TabPanel } from 'react-tabs';
 import {
   Accordion,
@@ -20,6 +20,16 @@ const AddressBlock = ({ addressBalance, label, currencyName, zecPrice, privateKe
   const { address } = addressBalance;
 
   const [copied, setCopied] = useState(false);
+  const [timerID, setTimerID] = useState(null);
+
+  useEffect(() => {
+    return () => {
+      if (timerID) {
+        clearTimeout(timerID);
+      }
+    };
+  });
+
   const balance = addressBalance.balance || 0;
 
   const openAddress = () => {
@@ -72,7 +82,7 @@ const AddressBlock = ({ addressBalance, label, currencyName, zecPrice, privateKe
                 onClick={() => {
                   clipboard.writeText(address);
                   setCopied(true);
-                  setTimeout(() => setCopied(false), 5000);
+                  setTimerID(setTimeout(() => setCopied(false), 5000));
                 }}
               >
                 {copied ? <span>Copied!</span> : <span>Copy Address</span>}

app/components/ScrollPane.js

@@ -20,21 +20,21 @@ export default class ScrollPane extends Component<Props, PaneState> {
 
   componentDidMount() {
     this.updateDimensions();
-    window.addEventListener('resize', this.updateDimensions.bind(this));
+    window.addEventListener('resize', this.updateDimensions);
   }
 
   componentWillUnmount() {
-    window.removeEventListener('resize', this.updateDimensions.bind(this));
+    window.removeEventListener('resize', this.updateDimensions);
   }
 
   /**
    * Calculate & Update state of height, needed for the scrolling
    */
-  updateDimensions() {
+  updateDimensions = () => {
     // eslint-disable-next-line react/destructuring-assignment
     const updateHeight = window.innerHeight - this.props.offsetHeight;
     this.setState({ height: updateHeight });
-  }
+  };
 
   render() {
     const { children, className } = this.props;

app/components/Send.js

@@ -64,6 +64,7 @@ const ToAddrBox = ({
     amountError = 'Amount cannot be empty';
   }
 
+  let buttonstate;
   if (
     !addressIsValid ||
     amountError ||
@@ -72,11 +73,15 @@ const ToAddrBox = ({
     parseFloat(toaddr.amount) === 0 ||
     fromAmount === 0
   ) {
-    setSendButtonEnable(false);
+    buttonstate = false;
   } else {
-    setSendButtonEnable(true);
+    buttonstate = true;
   }
 
+  setTimeout(() => {
+    setSendButtonEnable(buttonstate);
+  }, 10);
+
   const usdValue = Utils.getZecToUsdString(zecPrice, toaddr.amount);
 
   const addReplyTo = () => {
@@ -121,7 +126,7 @@ const ToAddrBox = ({
             type="number"
             step="any"
             className={cstyles.inputbox}
-            value={toaddr.amount}
+            value={isNaN(toaddr.amount) ? '' : toaddr.amount}
             onChange={e => updateToField(toaddr.id, null, e, null)}
           />
           <img