Fix walletAddress validation in stepThree

poanetwork · Mar 15, 2018 · 7a53055 · 7a53055
1 parent ab868b2
commit 7a53055
Show file tree

Hide file tree

Showing 3 changed files with 36 additions and 10 deletions.
diff --git a/src/components/stepThree/index.js b/src/components/stepThree/index.js
@@ -1,5 +1,6 @@
 import React from "react";
 import "../../assets/stylesheets/application.css";
+import Web3 from 'web3'
 import { Link } from "react-router-dom";
 import { setExistingContractParams, getNetworkVersion, getNetWorkNameById } from "../../utils/blockchainHelpers";
 import { gweiToWei, weiToGwei } from "../../utils/utils";
@@ -55,6 +56,7 @@ export class stepThree extends React.Component {
       loading: true,
       gasPriceSelected: gasPriceStore.slow.id,
       minCap: '',
+      walletAddress: '',
       validation: {
         gasPrice: {
           pristine: true,
@@ -63,20 +65,25 @@ export class stepThree extends React.Component {
         minCap: {
           pristine: true,
           valid: INVALID
+        },
+        walletAddress: {
+          pristine: true,
+          valid: INVALID
         }
       }
     }
   }
 
   componentDidMount () {
-    const { gasPriceStore } = this.props
+    const { gasPriceStore, tierStore } = this.props
 
     gasPriceStore.updateValues()
       .then(() => this.setGasPrice(gasPriceStore.slow))
       .catch(() => noGasPriceAvailable())
       .then(() => {
         this.addCrowdsale()
         this.setState({ loading: false })
+        this.updateWalletAddress(tierStore.tiers[0].walletAddress)
         window.scrollTo(0, 0)
       })
   }
@@ -184,6 +191,25 @@ export class stepThree extends React.Component {
     }
   }
 
+  updateWalletAddress = address => {
+    const isAddressValid = Web3.utils.isAddress(address) ? VALID : INVALID;
+
+    const newState = update(this.state, {
+      walletAddress: { $set: address },
+      validation: {
+        walletAddress: {
+          $set: {
+            pristine: false,
+            valid: isAddressValid
+          },
+        },
+      },
+    });
+
+    this.setState(newState)
+    this.props.tierStore.updateWalletAddress(address, isAddressValid)
+  }
+
   updateMinCap = ({ value, pristine, valid }) => {
     const newState = update(this.state, {
       validation: {
@@ -322,10 +348,11 @@ export class stepThree extends React.Component {
             side="left"
             type="text"
             title={WALLET_ADDRESS}
-            value={tierStore.tiers[0] && tierStore.tiers[0].walletAddress}
-            valid={tierStore.validTiers[0] && tierStore.validTiers[0].walletAddress}
+            value={this.state.walletAddress}
+            valid={this.state.validation.walletAddress.valid}
+            pristine={this.state.validation.walletAddress.pristine}
             errorMessage={VALIDATION_MESSAGES.WALLET_ADDRESS}
-            onChange={e => this.updateTierStore(e, "walletAddress", 0)}
+            onChange={e => this.updateWalletAddress(e.target.value)}
             description="Where the money goes after investors transactions. Immediately after each transaction. We
              recommend to setup a multisig wallet with hardware based signers."
           />

diff --git a/src/stores/TierStore.js b/src/stores/TierStore.js
@@ -3,7 +3,6 @@ import { VALIDATION_TYPES } from '../utils/constants'
 import {
   validateTime,
   validateSupply,
-  validateAddress,
   validateLaterTime,
   validateLaterOrEqualTime,
   validateTier
@@ -62,9 +61,6 @@ class TierStore {
       case 'tier':
         this.validTiers[index][property] = validateTier(this.tiers[index][property]) ? VALID : INVALID
         break
-      case 'walletAddress':
-        this.validTiers[index][property] = validateAddress(this.tiers[index][property]) ? VALID : INVALID
-        break
       case 'supply':
         this.validTiers[index][property] = validateSupply(this.tiers[index][property]) ? VALID : INVALID
         break
@@ -88,6 +84,11 @@ class TierStore {
     this.validTiers[tierIndex].rate = validity
   }
 
+  @action updateWalletAddress = (value, validity) => {
+    this.tiers[0].walletAddress = value
+    this.validTiers[0].walletAddress = validity
+  }
+
   @action validateEditedTier = (property, index) => {
     switch (property) {
       case 'endTime':

diff --git a/src/utils/utils.js b/src/utils/utils.js
@@ -82,8 +82,6 @@ export const validateLaterTime = (laterTime, previousTime) => getTimeAsNumber(la
 
 export const validateLaterOrEqualTime = (laterTime, previousTime) => getTimeAsNumber(laterTime) >= getTimeAsNumber(previousTime)
 
-export const validateAddress = (address) => !(!address || address.length !== 42)
-
 export function toFixed(x) {
   if (Math.abs(x) < 1.0) {
     let e = parseInt(x.toString().split('e-')[1], 10);