Merge pull request #22 from jrainville/fix/warnings

fix: remove react warnings

config/webserver.js

@@ -1,5 +1,5 @@
 module.exports = {
-  enabled: true,
+  enabled: false,
   host: "localhost",
   openBrowser: true,
   port: 8000

package.json

@@ -13,7 +13,7 @@
     "connected-react-router": "^6.3.2",
     "debounce": "^1.2.0",
     "decimal.js": "^10.0.2",
-    "embark": "4.0.1",
+    "embark": "4.0.2",
     "embark-solium": "0.0.1",
     "history": "^4.7.2",
     "idb": "4.0.3",

src/common/blockchain/index.js

@@ -1,4 +1,3 @@
-/* global web3 */
 import utils from './utils'
 import EmbarkJS from '../../embarkArtifacts/embarkjs'
 

src/common/data/dapp.js

@@ -33,7 +33,7 @@ export default class DappModel {
 }
 
 const RECENTLY_ADDED_SIZE = 50
-const HIGHEST_RANKED_SIZE = 50
+// const HIGHEST_RANKED_SIZE = 50
 
 export class DappState {
   constructor() {

src/common/styles/_base.scss

@@ -1,5 +1,7 @@
 /*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */
 
+@import './colors';
+
 /* Document
    ========================================================================== */
 
@@ -349,3 +351,8 @@ template {
 [hidden] {
   display: none;
 }
+
+.link {
+  color: $link-color;
+  cursor: pointer;
+}

src/modules/App/Router.jsx

@@ -1,4 +1,4 @@
-import React from 'react'
+import React, { Fragment } from 'react'
 import PropTypes from 'prop-types'
 import { Route, Switch } from 'react-router-dom'
 import Home from '../Home'
@@ -21,23 +21,25 @@ class Router extends React.Component {
   }
 
   render() {
-    return [
-      <Switch key={1}>
-        <Route exact path="/" component={Home} />
-        <Route path="/categories/:id" component={Filtered} />
-        <Route path="/all" component={Dapps} />
-        <Route path="/recently-added" component={RecentlyAdded} />
-        <Route path="/terms" component={Terms} />
-        <Route path="/:dapp_name" component={Home} />
-      </Switch>,
-      <Vote key={2} />,
-      <Submit key={3} />,
-      <HowToSubmit key={4} />,
-      <TransactionStatus key={5} />,
-      <Alert key={6} />,
-      <Route key={7} path="/:dapp_name" component={Profile} />,
-      <Withdraw key={8} />,
-    ]
+    return (
+      <Fragment>
+        <Switch>
+          <Route exact path="/" component={Home} />
+          <Route path="/categories/:id" component={Filtered} />
+          <Route path="/all" component={Dapps} />
+          <Route path="/recently-added" component={RecentlyAdded} />
+          <Route path="/terms" component={Terms} />
+          <Route path="/:dapp_name" component={Home} />
+        </Switch>
+        <Vote />
+        <Submit />
+        <HowToSubmit />
+        <TransactionStatus />
+        <Alert />
+        <Route path="/:dapp_name" component={Profile} />
+        <Withdraw />
+      </Fragment>
+    )
   }
 }
 

src/modules/Dapps/Dapps.reducer.js

@@ -1,5 +1,4 @@
 import reducerUtil from '../../common/utils/reducer'
-import { showAlertAction } from '../Alert/Alert.reducer'
 import BlockchainSDK from '../../common/blockchain'
 import { TYPE_SUBMIT } from '../TransactionStatus/TransactionStatus.utilities'
 import DappModel, { dappsInitialState, DappState } from '../../common/data/dapp'

src/modules/Profile/Profile.jsx

@@ -60,9 +60,9 @@ const ProfileContent = ({
             alt="App icon"
           />
           <img src={chat} className={styles.chat_icon} alt="Chat" />
-          <a href="#" target="_blank" className={styles.chat_link}>
+          <span className={styles.chat_link + ' link'}>
             {`Open ${name} chat`}
-          </a>
+          </span>
         </div>
         <div className={styles.url}>
           <span className={styles.heading}>URL</span>

src/modules/Submit/Submit.jsx

@@ -361,7 +361,10 @@ class Submit extends React.Component {
               <div className={`${styles.block} ${styles.blockSubmit}`}>
                 <div className={styles.terms}>
                   By continuing you agree to our
-                  <a onClick={onClickTerms}> Terms and Conditions.</a>
+                  <span onClick={onClickTerms} className="link">
+                    {' '}
+                    Terms and Conditions.
+                  </span>
                 </div>
                 <button
                   className={styles.submitButton}

src/modules/Vote/Vote.jsx

@@ -214,7 +214,9 @@ class Vote extends Component {
                   <p className={styles.disclaimer}>
                     SNT you spend to upvote is locked in the contract and
                     contributes directly to {dapp.name}'s ranking.{' '}
-                    <a onClick={onClickLearnMoreUpVote}>Learn more↗</a>
+                    <span className="link" onClick={onClickLearnMoreUpVote}>
+                      Learn more↗
+                    </span>
                   </p>
                 )}
                 {!isUpvote && (
@@ -222,7 +224,9 @@ class Vote extends Component {
                     SNT you spend to downvote goes directly back to {dapp.name}.
                     Downvoting moves their DApp down by 1% of the current
                     ranking. The cost is fixed by our unique bonded curve.{' '}
-                    <a onClick={onClickLearnMoreDownVote}>Learn more↗</a>
+                    <span className="link" onClick={onClickLearnMoreDownVote}>
+                      Learn more↗
+                    </span>
                   </p>
                 )}
               </div>

src/modules/Withdraw/Withdraw.jsx

@@ -27,7 +27,7 @@ class Withdraw extends React.Component {
   }
 
   handleSNTChange(e) {
-    const { dapp, withdrawMax } = this.props
+    const { withdrawMax } = this.props
     const { value } = e.target
     if (value !== '' && /^[1-9][0-9]*$/.test(value) === false) return
 
@@ -40,14 +40,21 @@ class Withdraw extends React.Component {
   }
 
   render() {
-    const { dappState, dapp, visible, onClickClose, sntValue, withdrawMax } = this.props
+    const {
+      dappState,
+      dapp,
+      visible,
+      onClickClose,
+      sntValue,
+      withdrawMax,
+    } = this.props
 
     if (dapp === null)
       return <Modal visible={false} onClickClose={onClickClose} />
 
     const currentSNTamount = dapp.sntValue
     const dappsByCategory = dappState.getDappsByCategory(dapp.category)
-    const afterVoteRating = (sntValue !== '' ? parseInt(sntValue, 10) : 0)
+    const afterVoteRating = sntValue !== '' ? parseInt(sntValue, 10) : 0
 
     let catPosition = dappsByCategory.length
     for (let i = 0; i < dappsByCategory.length; ++i) {
@@ -88,12 +95,11 @@ class Withdraw extends React.Component {
               <img src={sntIcon} alt="SNT" width="24" height="24" />
               {currentSNTamount.toLocaleString()}
             </span>
-            {afterVoteRating !== null &&
-              afterVoteRating !== 0 && (
-                <span className={styles.redBadge}>
-                  {`${afterVoteRating.toLocaleString()} ↓`}
-                </span>
-              )}
+            {afterVoteRating !== null && afterVoteRating !== 0 && (
+              <span className={styles.redBadge}>
+                {`${afterVoteRating.toLocaleString()} ↓`}
+              </span>
+            )}
           </div>
           <div className={styles.itemRow}>
             <span className={styles.item}>
@@ -116,7 +122,7 @@ class Withdraw extends React.Component {
         <div className={`${styles.inputArea} ${styles.inputAreaBorder}`}>
           <input
             type="text"
-            value={sntValue}
+            value={!sntValue && sntValue !== 0 ? withdrawMax : sntValue}
             onChange={this.handleSNTChange}
             style={{ width: `${21 * Math.max(1, sntValue.length)}px` }}
           />