Additional linting

.eslintrc.json

@@ -0,0 +1,10 @@
+{
+  "extends": "standard",
+  "env": {
+    "node": true,
+    "mocha": true
+  },
+  "parserOptions": {
+    "ecmaVersion": 10
+  }
+}

package.json

@@ -9,12 +9,11 @@
     "build": "gatsby build --prefix-paths",
     "build:normal": "gatsby build",
     "develop": "gatsby develop",
-    "format": "prettier --write \"**/*.{js,jsx,json,md}\"",
     "lint": "standard --env mocha --fix",
     "start": "npm run develop",
     "serve": "gatsby serve",
     "clean": "gatsby clean",
-    "test": "echo \"Write tests! -> https://gatsby.dev/unit-testing\""
+    "test": "npm run lint"
   },
   "dependencies": {
     "adminlte-2-react": "^0.1.27",

src/components/admin-lte/wallet/import.js

@@ -157,27 +157,25 @@ class ImportWallet extends React.Component {
   }
 
   validateInputs () {
-    try {
+    const { mnemonic } = _this.state
-      const { mnemonic } = _this.state
+    if (mnemonic) {
-      if (mnemonic) {
+      const spaceCount = mnemonic.split(' ').length // mnemonic.match(/ /g).length
-        const spaceCount = mnemonic.split(' ').length // mnemonic.match(/ /g).length
 
-        if (spaceCount !== 12) {
+      if (spaceCount !== 12) {
-          console.log('reject')
+        console.log('reject')
-          throw new Error('mnemonic must contain 12 words')
+        throw new Error('mnemonic must contain 12 words')
-        }
-      } else {
-        throw new Error('12 word mnemonic is required')
       }
-    } catch (error) {
+    } else {
-      throw error
+      throw new Error('12 word mnemonic is required')
     }
   }
 }
+
 ImportWallet.propTypes = {
   walletInfo: PropTypes.object.isRequired,
   setWalletInfo: PropTypes.func.isRequired,
   updateBalance: PropTypes.func.isRequired,
   setBchWallet: PropTypes.func.isRequired
 }
+
 export default ImportWallet

src/components/admin-lte/wallet/index.js

@@ -1,3 +1,5 @@
+/* eslint-disable */
+
 import React from 'react'
 import PropTypes from 'prop-types'
 import { Content } from 'adminlte-2-react'
@@ -27,7 +29,7 @@ class Wallet extends React.Component {
 
           {_this.props.walletInfo.mnemonic &&
             _this.props.walletInfo.from === 'created' && (
-              <WalletInfo walletInfo={_this.props.walletInfo} />
+            <WalletInfo walletInfo={_this.props.walletInfo} />
           )}
 
           <ImportWallet
@@ -39,7 +41,7 @@ class Wallet extends React.Component {
 
           {_this.props.walletInfo.mnemonic &&
             _this.props.walletInfo.from === 'imported' && (
-              <WalletInfo walletInfo={_this.props.walletInfo} />
+            <WalletInfo walletInfo={_this.props.walletInfo} />
           )}
 
           <InfoWallets />

src/components/admin-lte/wallet/info.js

@@ -1,30 +1,30 @@
-import React from "react"
+import React from 'react'
 
-import { Row, Col, Box } from "adminlte-2-react"
+import { Row, Col, Box } from 'adminlte-2-react'
-import { FontAwesomeIcon } from "@fortawesome/react-fontawesome"
+import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'
 
 class InfoWallets extends React.Component {
-  state = {}
+  // state = {}
 
-  render() {
+  render () {
     return (
       <Row>
         <Col sm={2} />
         <Col sm={8}>
-          <Box className="hover-shadow border-none mt-2">
+          <Box className='hover-shadow border-none mt-2'>
             <Row>
-              <Col sm={12} className="text-center">
+              <Col sm={12} className='text-center'>
                 <h1>
                   <FontAwesomeIcon
-                    className="title-icon"
+                    className='title-icon'
-                    size="xs"
+                    size='xs'
-                    icon={"exclamation-triangle"}
+                    icon='exclamation-triangle'
                   />
                   <span>Webs Wallets</span>
                 </h1>
               </Col>
 
-              <Col sm={12} className="text-center mt-2 mb-2">
+              <Col sm={12} className='text-center mt-2 mb-2'>
                 <p>
                   Bitcoin.com Mint is an open source, non-custodial web wallet
                   supporting SLP and BCH. Web wallets offer user convenience,

src/components/footer/index.js

@@ -17,7 +17,7 @@ class Footer extends React.Component {
                 <a
                   href='https://psfoundation.cash/'
                   target='_blank'
-                  rel='noreferrer'
+                  rel='noopener noreferrer'
                 >
                   Permissionless Software Foundation
                 </a>
@@ -28,7 +28,7 @@ class Footer extends React.Component {
                 <a
                   href='https://github.com/Permissionless-Software-Foundation/gatsby-ipfs-web-wallet'
                   target='_blank'
-                  rel='noreferrer'
+                  rel='noopener noreferrer'
                 >
                   Github
                 </a>

src/components/qr-scanner/modal.js

@@ -1,40 +1,42 @@
-import React, { Component } from "react"
+import React, { Component } from 'react'
-import PropTypes from "prop-types"
+import PropTypes from 'prop-types'
-import { Content, Button } from "adminlte-2-react"
+import { Content, Button } from 'adminlte-2-react'
-import QScanner from "./qr-scanner"
+import QScanner from './qr-scanner'
 let _this
 class ScannerModal extends Component {
-  constructor(props) {
+  constructor (props) {
     super(props)
     _this = this
     this.state = {}
+
+    this.modalFooter = (
+      <>
+        <Button text='Close' pullLeft onClick={this.props.handleOnHide} />
+      </>
+    )
   }
 
-  modalFooter = (
+  render () {
-    <React.Fragment>
-      <Button text="Close" pullLeft onClick={this.props.onHide} />
-    </React.Fragment>
-  )
-
-  render() {
     return (
       <Content
-        title="Qr Scanner"
+        title='Qr Scanner'
         modal
         modalFooter={this.modalFooter}
         show={_this.props.show}
-        modalCloseButton={true}
+        modalCloseButton
-        onHide={_this.props.onHide}
+        onHide={_this.props.handleOnHide}
       >
-        <QScanner onError={_this.props.onError} onScan={_this.props.onScan} />
+        <QScanner onError={_this.props.handleOnError} onScan={_this.props.handleOnScan} />
       </Content>
     )
   }
 }
+
 ScannerModal.propTypes = {
   show: PropTypes.bool.isRequired,
-  onHide: PropTypes.func.isRequired,
+  OnHide: PropTypes.func.isRequired,
   onError: PropTypes.func,
-  onScan: PropTypes.func,
+  onScan: PropTypes.func
 }
+
 export default ScannerModal

src/components/qr-scanner/qr-scanner.js

@@ -1,37 +1,39 @@
-import React, { Component } from "react"
+import React, { Component } from 'react'
-import PropTypes from "prop-types"
+import PropTypes from 'prop-types'
-import "./qr-scanner.css"
+import './qr-scanner.css'
-import QrReader from "react-qr-reader"
+import QrReader from 'react-qr-reader'
 
 let _this
 class QScanner extends Component {
-  constructor(props) {
+  constructor (props) {
     super(props)
     _this = this
 
     this.state = {
-      result: "No Result",
+      result: 'No Result',
-      facingMode: "environment",
+      facingMode: 'environment'
+    }
+
+    this.handleScan = data => {
+      if (data) {
+        this.setState({
+          result: data
+        })
+        _this.props.onScan && _this.props.onScan(data)
+      }
+    }
+
+    this.handleError = err => {
+      console.error(err)
+      _this.props.onError ? _this.props.onError(err) : console.error(err)
     }
   }
 
-  handleScan = data => {
+  render () {
-    if (data) {
-      this.setState({
-        result: data,
-      })
-      _this.props.onScan && _this.props.onScan(data)
-    }
-  }
-  handleError = err => {
-    console.error(err)
-    _this.props.onError ? _this.props.onError(err) : alert(err)
-  }
-  render() {
     return (
-      <div className="QRScanner-container">
+      <div className='QRScanner-container'>
         <h4>Facing Mode: {_this.state.facingMode}</h4>
-        <button className="change-button" onClick={_this.changeMode}>
+        <button className='change-button' onClick={_this.handleChangeMode}>
           Change
         </button>
         <QrReader
@@ -41,21 +43,22 @@ class QScanner extends Component {
           facingMode={_this.state.facingMode}
         />
         <b>
-          <p className="qr-result">{this.state.result}</p>
+          <p className='qr-result'>{this.state.result}</p>
         </b>
       </div>
     )
   }
-  changeMode() {
+
-    let mode = _this.state.facingMode === "user" ? "environment" : "user"
+  handleChangeMode () {
+    const mode = _this.state.facingMode === 'user' ? 'environment' : 'user'
     console.log(`changing to ${mode} mode`)
     _this.setState({
-      facingMode: mode,
+      facingMode: mode
     })
   }
 }
 QScanner.propTypes = {
   onError: PropTypes.func,
-  onScan: PropTypes.func,
+  onScan: PropTypes.func
 }
 export default QScanner

src/pages/404.js

@@ -1,11 +1,11 @@
 import React from 'react'
 
 import Layout from '../components/layout'
-import SEO from '../components/seo'
+import Seo from '../components/seo'
 
 const NotFoundPage = () => (
   <Layout>
-    <SEO title='404: Not found' />
+    <Seo title='404: Not found' />
     <h1>NOT FOUND</h1>
     <p>You just hit a route that doesn&#39;t exist... the sadness.</p>
   </Layout>

src/pages/page-2.js

@@ -2,11 +2,11 @@ import React from 'react'
 import { Link } from 'gatsby'
 
 import Layout from '../components/layout'
-import SEO from '../components/seo'
+import Seo from '../components/seo'
 
 const SecondPage = () => (
   <Layout>
-    <SEO title='Page two' />
+    <Seo title='Page two' />
     <h1>Hi from the second page</h1>
     <p>Welcome to page 2</p>
     <Link to='/'>Go back to the homepage</Link>