From 187bfe23e53db48eac4baf01bb9a7eb66841837b Mon Sep 17 00:00:00 2001
From: Daniel Gonzalez <danielhumgon@gmail.com>
Date: Tue, 7 Jul 2020 03:09:46 -0400
Subject: [PATCH 1/2] fix(issues): Fixed some visual issues

---
 src/components/admin-lte/index.js             | 75 ++++++++++---------
 src/components/admin-lte/send-receive/send.js |  4 +-
 src/components/admin-lte/tokens/index.js      |  2 +-
 .../admin-lte/tokens/token-modal.js           | 32 ++++----
 src/components/qr-scanner/modal.js            |  6 +-
 5 files changed, 63 insertions(+), 56 deletions(-)

diff --git a/src/components/admin-lte/index.js b/src/components/admin-lte/index.js
index e728a83..87bade3 100644
--- a/src/components/admin-lte/index.js
+++ b/src/components/admin-lte/index.js
@@ -3,6 +3,7 @@ import PropTypes from 'prop-types'
 import Configure from './configure'
 import Tokens from './tokens'
 import Wallet from './wallet'
+
 // import Audit from "./audit"
 
 import AdminLTE, { Sidebar, Navbar } from 'adminlte-2-react'
@@ -39,21 +40,21 @@ class AdminLTEPage extends React.Component {
     _this.BchWallet = BchWallet
 
     _this.sidebar = [
-      <Item icon='fa-exchange-alt' key='SendReceive' text='Send/Receive' />,
-      <Item icon='fas-coins' key='Tokens' text='Tokens' />,
-      <Item icon='fa-wallet' key='Wallet' text='Wallet' activeOn='/' />,
-      <Item icon='fa-qrcode' key='qrReader' text='Qr Scanner' />,
-      <Item icon='fas-cog' key='Configure' text='Configure' />
+      <Item icon="fa-exchange-alt" key="SendReceive" text="Send/Receive" />,
+      <Item icon="fas-coins" key="Tokens" text="Tokens" />,
+      <Item icon="fa-wallet" key="Wallet" text="Wallet" activeOn="/" />,
+      <Item icon="fa-qrcode" key="qrReader" text="Qr Scanner" />,
+      <Item icon="fas-cog" key="Configure" text="Configure" />
     ]
   }
 
   render () {
     return (
       <>
-        <AdminLTE title={['FullStack.cash']} titleShort={['PSF']} theme='blue'>
+        <AdminLTE title={['FullStack.cash']} titleShort={['PSF']} theme="blue">
           <Sidebar.Core>
-            <Item key='Balance' text='Balance' icon='fab-bitcoin'>
-              <div className='sidebar-balance'>
+            <Item key="Balance" text="Balance" icon="fab-bitcoin">
+              <div className="sidebar-balance">
                 <div>
                   <h3>BCH Balance </h3>
 
@@ -70,9 +71,8 @@ class AdminLTEPage extends React.Component {
           <Navbar.Core>
             <VersionStatus />
           </Navbar.Core>
-          <Layout path='/'>
-            <div className='components-container'>
-
+          <Layout path="/">
+            <div className="components-container">
               {_this.state.section === 'Send/Receive' && (
                 <SendReceive
                   setWalletInfo={_this.props.setWalletInfo}
@@ -100,15 +100,6 @@ class AdminLTEPage extends React.Component {
                 />
               )}
 
-              {_this.state.section === 'Wallet' && (
-                <Wallet
-                  setWalletInfo={_this.props.setWalletInfo}
-                  walletInfo={_this.props.walletInfo}
-                  updateBalance={_this.props.updateBalance}
-                  setBchWallet={_this.props.setBchWallet}
-                />
-              )}
-
               {_this.state.section === 'Configure' && (
                 <Configure
                   walletInfo={_this.props.walletInfo}
@@ -118,15 +109,14 @@ class AdminLTEPage extends React.Component {
               )}
 
               {_this.renderNewViewItems()}
-
             </div>
           </Layout>
         </AdminLTE>
         <Router>
           <ScannerModal
             show={_this.state.showScannerModal}
-            onHide={_this.handleToggleScannerModal}
-            path='/'
+            handleOnHide={_this.handleToggleScannerModal}
+            path="/"
           />
         </Router>
       </>
@@ -199,7 +189,9 @@ class AdminLTEPage extends React.Component {
           childrens[i].id = textValue
           const ignore = ignoreItems.find(val => textValue === val)
           // Ignore menu items without link to components
-          if (!ignore) { childrens[i].onclick = () => this.changeSection(textValue) }
+          if (!ignore) {
+            childrens[i].onclick = () => this.changeSection(textValue)
+          }
         }
       }
     } catch (error) {
@@ -271,6 +263,9 @@ class AdminLTEPage extends React.Component {
     _this.setState({
       showScannerModal: !_this.state.showScannerModal
     })
+    setTimeout(() => {
+      console.log(_this.state.showScannerModal)
+    }, 500)
   }
 
   // Render non-default menu items. The catch ensures that the render function
@@ -280,22 +275,34 @@ class AdminLTEPage extends React.Component {
       return menuComponents && menuComponents.map(m => m.menuItem)
     } catch (err) {
       // TODO: Figure out how to return an invisible Item.
-      return <Item style={{ display: 'none' }} />
+      return _this.getInvisibleMenuItem() // <Item style={{ display: 'none' }} />
     }
   }
 
   // Displays the View corresponding to the dynamically loaded menu item.
   renderNewViewItems () {
     try {
-      return (menuComponents && menuComponents.map(m => {
-        if (_this.state.section === m.key) {
-          return m.component
-        }
-        return ''
-      }))
-    } catch (err) {
-
-    }
+      return (
+        menuComponents &&
+        menuComponents.map(m => {
+          if (_this.state.section === m.key) {
+            return m.component
+          }
+          return ''
+        })
+      )
+    } catch (err) {}
+  }
+  getInvisibleMenuItem () {
+    return (
+      <li style={{ display: 'none' }}>
+        {/* Adding this childrens prevents console errors */}
+        <a href="#">
+          <span></span>
+          <span></span>
+        </a>
+      </li>
+    )
   }
 }
 // Props prvided by redux
diff --git a/src/components/admin-lte/send-receive/send.js b/src/components/admin-lte/send-receive/send.js
index 40e487e..b0e8950 100644
--- a/src/components/admin-lte/send-receive/send.js
+++ b/src/components/admin-lte/send-receive/send.js
@@ -89,8 +89,8 @@ class Send extends React.Component {
           </Row>
           <ScannerModal
             show={_this.state.showScan}
-            onHide={_this.handleToggleScanner}
-            onScan={_this.handleOnScan}
+            handleOnHide={_this.handleToggleScanner}
+            handleOnScan={_this.handleOnScan}
           />
         </Content>
       </>
diff --git a/src/components/admin-lte/tokens/index.js b/src/components/admin-lte/tokens/index.js
index f32ca2e..b7a0bfc 100644
--- a/src/components/admin-lte/tokens/index.js
+++ b/src/components/admin-lte/tokens/index.js
@@ -81,7 +81,7 @@ class Tokens extends React.Component {
         )}
         <TokenModal
           token={_this.state.selectedToken ? _this.state.selectedToken : {}}
-          onHide={_this.handleToggleModal}
+          handleOnHide={_this.handleToggleModal}
           show={_this.state.showModal}
         />
       </>
diff --git a/src/components/admin-lte/tokens/token-modal.js b/src/components/admin-lte/tokens/token-modal.js
index 2c31adc..127a874 100644
--- a/src/components/admin-lte/tokens/token-modal.js
+++ b/src/components/admin-lte/tokens/token-modal.js
@@ -13,7 +13,7 @@ class TokenModal extends React.Component {
 
     this.modalFooter = (
       <>
-        <Button text='Close' pullLeft onClick={this.props.handleOnHide} />
+        <Button text="Close" pullLeft onClick={this.props.handleOnHide} />
       </>
     )
   }
@@ -32,13 +32,13 @@ class TokenModal extends React.Component {
         >
           <Row>
             <Col sm={12}>
-              <Box className=' border-none '>
+              <Box className=" border-none ">
                 <Row>
                   <Col
                     sm={12}
-                    className='text-center   tokenModal-info-container'
+                    className="text-center   tokenModal-info-container"
                   >
-                    <Row className='tokenModal-info-content mt-1 text-left'>
+                    <Row className="tokenModal-info-content mt-1 text-left">
                       <Col xs={12}>
                         <Row>
                           <Col xs={12} sm={3}>
@@ -49,16 +49,16 @@ class TokenModal extends React.Component {
                           </Col>
                           <Col xs={2} sm={1}>
                             <FontAwesomeIcon
-                              className='icon btn-animation'
-                              size='lg'
+                              className="icon btn-animation"
+                              size="lg"
                               onClick={() => _this.copyToClipBoard('tokenId')}
-                              icon='copy'
+                              icon="copy"
                             />
                           </Col>
                         </Row>
                       </Col>
                     </Row>
-                    <Row className='tokenModal-info-content mt-1 text-left'>
+                    <Row className="tokenModal-info-content mt-1 text-left">
                       <Col xs={12}>
                         <Row>
                           <Col xs={12} sm={3}>
@@ -67,8 +67,8 @@ class TokenModal extends React.Component {
                           <Col xs={12} sm={9}>
                             <a
                               href={`http://${token.url}`}
-                              target='_blank'
-                              rel='noopener noreferrer'
+                              target="_blank"
+                              rel="noopener noreferrer"
                             >
                               {token.url}
                             </a>
@@ -76,7 +76,7 @@ class TokenModal extends React.Component {
                         </Row>
                       </Col>
                     </Row>
-                    <Row className='tokenModal-info-content mt-1 text-left'>
+                    <Row className="tokenModal-info-content mt-1 text-left">
                       <Col xs={12}>
                         <Row>
                           <Col xs={12} sm={3}>
@@ -88,7 +88,7 @@ class TokenModal extends React.Component {
                         </Row>
                       </Col>
                     </Row>
-                    <Row className='tokenModal-info-content mt-1 text-left'>
+                    <Row className="tokenModal-info-content mt-1 text-left">
                       <Col xs={12}>
                         <Row>
                           <Col xs={12} sm={3}>
@@ -100,7 +100,7 @@ class TokenModal extends React.Component {
                         </Row>
                       </Col>
                     </Row>
-                    <Row className='tokenModal-info-content mt-1 text-left'>
+                    <Row className="tokenModal-info-content mt-1 text-left">
                       <Col xs={12}>
                         <Row>
                           <Col xs={12} sm={3}>
@@ -112,7 +112,7 @@ class TokenModal extends React.Component {
                         </Row>
                       </Col>
                     </Row>
-                    <Row className='tokenModal-info-content mt-1 text-left'>
+                    <Row className="tokenModal-info-content mt-1 text-left">
                       <Col xs={12}>
                         <Row>
                           <Col xs={12} sm={3}>
@@ -124,7 +124,7 @@ class TokenModal extends React.Component {
                         </Row>
                       </Col>
                     </Row>
-                    <Row className='tokenModal-info-content mt-1 text-left'>
+                    <Row className="tokenModal-info-content mt-1 text-left">
                       <Col xs={12}>
                         <Row>
                           <Col xs={12} sm={3}>
@@ -160,6 +160,6 @@ class TokenModal extends React.Component {
 TokenModal.propTypes = {
   token: PropTypes.object.isRequired,
   show: PropTypes.bool.isRequired,
-  onHide: PropTypes.func.isRequired
+  handleOnHide: PropTypes.func.isRequired
 }
 export default TokenModal
diff --git a/src/components/qr-scanner/modal.js b/src/components/qr-scanner/modal.js
index 8900273..ad8d2e6 100644
--- a/src/components/qr-scanner/modal.js
+++ b/src/components/qr-scanner/modal.js
@@ -34,9 +34,9 @@ class ScannerModal extends Component {
 
 ScannerModal.propTypes = {
   show: PropTypes.bool.isRequired,
-  OnHide: PropTypes.func.isRequired,
-  onError: PropTypes.func,
-  onScan: PropTypes.func
+  handleOnHide: PropTypes.func.isRequired,
+  handleOnError: PropTypes.func,
+  handleOnScan: PropTypes.func
 }
 
 export default ScannerModal

From e51fda567ab0e6261adeebd9042e25179231788d Mon Sep 17 00:00:00 2001
From: Daniel Gonzalez <danielhumgon@gmail.com>
Date: Tue, 7 Jul 2020 04:27:04 -0400
Subject: [PATCH 2/2] fix(lint): Fixing linting issues

---
 src/components/admin-lte/index.js             | 35 ++++++++++---------
 src/components/admin-lte/send-receive/send.js | 20 +++++++----
 src/components/admin-lte/tokens/index.js      |  6 ++--
 .../admin-lte/tokens/token-modal.js           | 30 ++++++++--------
 4 files changed, 49 insertions(+), 42 deletions(-)

diff --git a/src/components/admin-lte/index.js b/src/components/admin-lte/index.js
index 87bade3..2a9aaa7 100644
--- a/src/components/admin-lte/index.js
+++ b/src/components/admin-lte/index.js
@@ -40,21 +40,21 @@ class AdminLTEPage extends React.Component {
     _this.BchWallet = BchWallet
 
     _this.sidebar = [
-      <Item icon="fa-exchange-alt" key="SendReceive" text="Send/Receive" />,
-      <Item icon="fas-coins" key="Tokens" text="Tokens" />,
-      <Item icon="fa-wallet" key="Wallet" text="Wallet" activeOn="/" />,
-      <Item icon="fa-qrcode" key="qrReader" text="Qr Scanner" />,
-      <Item icon="fas-cog" key="Configure" text="Configure" />
+      <Item icon='fa-exchange-alt' key='SendReceive' text='Send/Receive' />,
+      <Item icon='fas-coins' key='Tokens' text='Tokens' />,
+      <Item icon='fa-wallet' key='Wallet' text='Wallet' activeOn='/' />,
+      <Item icon='fa-qrcode' key='qrReader' text='Qr Scanner' />,
+      <Item icon='fas-cog' key='Configure' text='Configure' />
     ]
   }
 
   render () {
     return (
       <>
-        <AdminLTE title={['FullStack.cash']} titleShort={['PSF']} theme="blue">
+        <AdminLTE title={['FullStack.cash']} titleShort={['PSF']} theme='blue'>
           <Sidebar.Core>
-            <Item key="Balance" text="Balance" icon="fab-bitcoin">
-              <div className="sidebar-balance">
+            <Item key='Balance' text='Balance' icon='fab-bitcoin'>
+              <div className='sidebar-balance'>
                 <div>
                   <h3>BCH Balance </h3>
 
@@ -71,8 +71,8 @@ class AdminLTEPage extends React.Component {
           <Navbar.Core>
             <VersionStatus />
           </Navbar.Core>
-          <Layout path="/">
-            <div className="components-container">
+          <Layout path='/'>
+            <div className='components-container'>
               {_this.state.section === 'Send/Receive' && (
                 <SendReceive
                   setWalletInfo={_this.props.setWalletInfo}
@@ -115,8 +115,8 @@ class AdminLTEPage extends React.Component {
         <Router>
           <ScannerModal
             show={_this.state.showScannerModal}
-            handleOnHide={_this.handleToggleScannerModal}
-            path="/"
+            handleOnHide={_this.onHandleToggleScannerModal}
+            path='/'
           />
         </Router>
       </>
@@ -249,14 +249,14 @@ class AdminLTEPage extends React.Component {
   addOnClickEventToScanner () {
     try {
       const qrScannerEle = document.getElementById('Qr Scanner')
-      qrScannerEle.onclick = () => _this.handleToggleScannerModal()
+      qrScannerEle.onclick = () => _this.onHandleToggleScannerModal()
     } catch (error) {
       console.error(error)
     }
   }
 
   // Controller to show the QR scanner
-  handleToggleScannerModal () {
+  onHandleToggleScannerModal () {
     if (!_this.state.showScannerModal) {
       _this.hideMenu()
     }
@@ -293,13 +293,14 @@ class AdminLTEPage extends React.Component {
       )
     } catch (err) {}
   }
+
   getInvisibleMenuItem () {
     return (
       <li style={{ display: 'none' }}>
         {/* Adding this childrens prevents console errors */}
-        <a href="#">
-          <span></span>
-          <span></span>
+        <a href='#'>
+          <span />
+          <span />
         </a>
       </li>
     )
diff --git a/src/components/admin-lte/send-receive/send.js b/src/components/admin-lte/send-receive/send.js
index b0e8950..cb06c75 100644
--- a/src/components/admin-lte/send-receive/send.js
+++ b/src/components/admin-lte/send-receive/send.js
@@ -53,7 +53,7 @@ class Send extends React.Component {
                         buttonRight={
                           <Button
                             icon='fa-qrcode'
-                            onClick={_this.handleToggleScanner}
+                            onClick={_this.handleModal}
                           />
                         }
                       />
@@ -89,8 +89,8 @@ class Send extends React.Component {
           </Row>
           <ScannerModal
             show={_this.state.showScan}
-            handleOnHide={_this.handleToggleScanner}
-            handleOnScan={_this.handleOnScan}
+            handleOnHide={_this.onHandleToggleScanner}
+            handleOnScan={_this.onHandleScan}
           />
         </Content>
       </>
@@ -199,7 +199,13 @@ class Send extends React.Component {
     }
   }
 
-  handleToggleScanner () {
+  onHandleToggleScanner () {
+    _this.setState({
+      showScan: !_this.state.showScan
+    })
+  }
+
+  handleModal () {
     _this.setState({
       showScan: !_this.state.showScan
     })
@@ -214,7 +220,7 @@ class Send extends React.Component {
     addressEle.value = ''
   }
 
-  handleOnScan (data) {
+  onHandleScan (data) {
     const validateAdrrs = ['bitcoincash', 'simpleledger']
     try {
       _this.resetAddressValue()
@@ -240,9 +246,9 @@ class Send extends React.Component {
       if (!isValid) {
         throw new Error('It should scan a bch address or slp address')
       }
-      _this.handleToggleScanner()
+      _this.onHandleToggleScanner()
     } catch (error) {
-      _this.handleToggleScanner()
+      _this.onHandleToggleScanner()
       _this.setState({
         errMsg: error.message
       })
diff --git a/src/components/admin-lte/tokens/index.js b/src/components/admin-lte/tokens/index.js
index b7a0bfc..eb9ab31 100644
--- a/src/components/admin-lte/tokens/index.js
+++ b/src/components/admin-lte/tokens/index.js
@@ -81,7 +81,7 @@ class Tokens extends React.Component {
         )}
         <TokenModal
           token={_this.state.selectedToken ? _this.state.selectedToken : {}}
-          handleOnHide={_this.handleToggleModal}
+          handleOnHide={_this.onHandleToggleModal}
           show={_this.state.showModal}
         />
       </>
@@ -119,10 +119,10 @@ class Tokens extends React.Component {
     _this.setState({
       selectedToken
     })
-    _this.handleToggleModal()
+    _this.onHandleToggleModal()
   }
 
-  handleToggleModal () {
+  onHandleToggleModal () {
     _this.setState({
       showModal: !_this.state.showModal
     })
diff --git a/src/components/admin-lte/tokens/token-modal.js b/src/components/admin-lte/tokens/token-modal.js
index 127a874..4fded45 100644
--- a/src/components/admin-lte/tokens/token-modal.js
+++ b/src/components/admin-lte/tokens/token-modal.js
@@ -13,7 +13,7 @@ class TokenModal extends React.Component {
 
     this.modalFooter = (
       <>
-        <Button text="Close" pullLeft onClick={this.props.handleOnHide} />
+        <Button text='Close' pullLeft onClick={this.props.handleOnHide} />
       </>
     )
   }
@@ -32,13 +32,13 @@ class TokenModal extends React.Component {
         >
           <Row>
             <Col sm={12}>
-              <Box className=" border-none ">
+              <Box className=' border-none '>
                 <Row>
                   <Col
                     sm={12}
-                    className="text-center   tokenModal-info-container"
+                    className='text-center   tokenModal-info-container'
                   >
-                    <Row className="tokenModal-info-content mt-1 text-left">
+                    <Row className='tokenModal-info-content mt-1 text-left'>
                       <Col xs={12}>
                         <Row>
                           <Col xs={12} sm={3}>
@@ -49,16 +49,16 @@ class TokenModal extends React.Component {
                           </Col>
                           <Col xs={2} sm={1}>
                             <FontAwesomeIcon
-                              className="icon btn-animation"
-                              size="lg"
+                              className='icon btn-animation'
+                              size='lg'
                               onClick={() => _this.copyToClipBoard('tokenId')}
-                              icon="copy"
+                              icon='copy'
                             />
                           </Col>
                         </Row>
                       </Col>
                     </Row>
-                    <Row className="tokenModal-info-content mt-1 text-left">
+                    <Row className='tokenModal-info-content mt-1 text-left'>
                       <Col xs={12}>
                         <Row>
                           <Col xs={12} sm={3}>
@@ -67,8 +67,8 @@ class TokenModal extends React.Component {
                           <Col xs={12} sm={9}>
                             <a
                               href={`http://${token.url}`}
-                              target="_blank"
-                              rel="noopener noreferrer"
+                              target='_blank'
+                              rel='noopener noreferrer'
                             >
                               {token.url}
                             </a>
@@ -76,7 +76,7 @@ class TokenModal extends React.Component {
                         </Row>
                       </Col>
                     </Row>
-                    <Row className="tokenModal-info-content mt-1 text-left">
+                    <Row className='tokenModal-info-content mt-1 text-left'>
                       <Col xs={12}>
                         <Row>
                           <Col xs={12} sm={3}>
@@ -88,7 +88,7 @@ class TokenModal extends React.Component {
                         </Row>
                       </Col>
                     </Row>
-                    <Row className="tokenModal-info-content mt-1 text-left">
+                    <Row className='tokenModal-info-content mt-1 text-left'>
                       <Col xs={12}>
                         <Row>
                           <Col xs={12} sm={3}>
@@ -100,7 +100,7 @@ class TokenModal extends React.Component {
                         </Row>
                       </Col>
                     </Row>
-                    <Row className="tokenModal-info-content mt-1 text-left">
+                    <Row className='tokenModal-info-content mt-1 text-left'>
                       <Col xs={12}>
                         <Row>
                           <Col xs={12} sm={3}>
@@ -112,7 +112,7 @@ class TokenModal extends React.Component {
                         </Row>
                       </Col>
                     </Row>
-                    <Row className="tokenModal-info-content mt-1 text-left">
+                    <Row className='tokenModal-info-content mt-1 text-left'>
                       <Col xs={12}>
                         <Row>
                           <Col xs={12} sm={3}>
@@ -124,7 +124,7 @@ class TokenModal extends React.Component {
                         </Row>
                       </Col>
                     </Row>
-                    <Row className="tokenModal-info-content mt-1 text-left">
+                    <Row className='tokenModal-info-content mt-1 text-left'>
                       <Col xs={12}>
                         <Row>
                           <Col xs={12} sm={3}>