Merge pull request #772 from poanetwork/validate-decimals-stepTwo-#769

(Fix) Validate decimals in step two
poanetwork · Apr 10, 2018 · 31c3a22 · 31c3a22
2 parents 1c41784 + acfc648
commit 31c3a22
Show file tree

Hide file tree

Showing 6 changed files with 35 additions and 38 deletions.
diff --git a/src/components/Common/TokenDecimals.js b/src/components/Common/TokenDecimals.js
@@ -1,13 +1,17 @@
 import React from 'react'
-import { validateDecimals } from '../../utils/validations'
+import { composeValidators, isLessOrEqualThan, isNonNegative, isRequired } from '../../utils/validations'
 import { TEXT_FIELDS } from '../../utils/constants'
 import { Field } from 'react-final-form'
 import { InputField2 } from './InputField2'
 import { acceptPositiveIntegerOnly } from '../../utils/utils'
 
 export const TokenDecimals = ({ disabled, errorStyle }) => (
   <Field
-    validate={validateDecimals}
+    validate={composeValidators(
+      isRequired(),
+      isNonNegative(),
+      isLessOrEqualThan("Should not be greater than 18")(18)
+    )}
     component={InputField2}
     parse={acceptPositiveIntegerOnly}
     side="left"

diff --git a/src/components/stepTwo/StepTwoForm.js b/src/components/stepTwo/StepTwoForm.js
@@ -10,7 +10,7 @@ const errorStyle = {
   fontWeight: 'bold',
   fontSize: '12px',
   width: '100%',
-  height: '10px',
+  height: '20px',
 }
 
 export const StepTwoForm = ({

diff --git a/src/components/stepTwo/__snapshots__/StepTwoForm.spec.js.snap b/src/components/stepTwo/__snapshots__/StepTwoForm.spec.js.snap
@@ -42,7 +42,7 @@ exports[`StepTwoForm Should render the component 1`] = `
               "color": "red",
               "fontSize": "12px",
               "fontWeight": "bold",
-              "height": "10px",
+              "height": "20px",
               "width": "100%",
             }
           }
@@ -84,7 +84,7 @@ exports[`StepTwoForm Should render the component 1`] = `
               "color": "red",
               "fontSize": "12px",
               "fontWeight": "bold",
-              "height": "10px",
+              "height": "20px",
               "width": "100%",
             }
           }
@@ -125,7 +125,31 @@ exports[`StepTwoForm Should render the component 1`] = `
               "color": "red",
               "fontSize": "12px",
               "fontWeight": "bold",
-              "height": "10px",
+              "height": "20px",
+              "width": "100%",
+            }
+          }
+        />
+        <p
+          className="error"
+          style={
+            Object {
+              "color": "red",
+              "fontSize": "12px",
+              "fontWeight": "bold",
+              "height": "20px",
+              "width": "100%",
+            }
+          }
+        />
+        <p
+          className="error"
+          style={
+            Object {
+              "color": "red",
+              "fontSize": "12px",
+              "fontWeight": "bold",
+              "height": "20px",
               "width": "100%",
             }
           }

diff --git a/src/components/stepTwo/index.js b/src/components/stepTwo/index.js
@@ -22,7 +22,7 @@ export class stepTwo extends Component {
       tokenValues: {
         name: this.props.tokenStore.name,
         ticker: this.props.tokenStore.ticker,
-        decimals: this.props.tokenStore.decimals,
+        decimals: this.props.tokenStore.decimals || 0,
       }
     }
   }

diff --git a/src/utils/validations.js b/src/utils/validations.js
@@ -7,7 +7,6 @@ export const validators = (type, value) => {
   return {
     name: value && typeof value === 'string' && 1 <= value.length && value.length <= 30,
     ticker: /^[a-zA-Z0-9]{1,5}$/.test(value),
-    decimals: (value === undefined || value === '') || (/^[0-9]+$/.test(value) && 0 <= value && value <= 18),
   }[type] || false
 }
 
@@ -21,11 +20,6 @@ export const validateTicker = (value) => {
   return isValid ? undefined : VALIDATION_MESSAGES.TICKER
 }
 
-export const validateDecimals = (value) => {
-  const isValid = validators('decimals', value)
-  return isValid ? undefined : VALIDATION_MESSAGES.DECIMALS
-}
-
 export const isPositive = (errorMsg = VALIDATION_MESSAGES.POSITIVE) => (value) => {
   const isValid = value > 0
   return isValid ? undefined : errorMsg

diff --git a/src/utils/validations.spec.js b/src/utils/validations.spec.js
@@ -13,7 +13,6 @@ import {
   isNonNegative,
   isPositive,
   isRequired,
-  validateDecimals,
   validateTicker,
   validateTokenName,
   validators
@@ -63,30 +62,6 @@ describe('validateTicker', () => {
   })
 })
 
-describe('validateDecimals', () => {
-  [
-    { value: '100', expected: VALIDATION_MESSAGES.DECIMALS },
-    { value: '-10', expected: VALIDATION_MESSAGES.DECIMALS },
-    { value: '20', expected: VALIDATION_MESSAGES.DECIMALS },
-    { value: '1.5', expected: VALIDATION_MESSAGES.DECIMALS },
-    { value: '1.', expected: VALIDATION_MESSAGES.DECIMALS },
-    { value: '1e1', expected: VALIDATION_MESSAGES.DECIMALS },
-    { value: '--', expected: VALIDATION_MESSAGES.DECIMALS },
-    { value: undefined, expected: undefined },
-    { value: '', expected: undefined },
-    { value: '0', expected: undefined },
-    { value: '1', expected: undefined },
-    { value: '10', expected: undefined },
-    { value: '18', expected: undefined },
-  ].forEach(testCase => {
-    const action = testCase.expected === undefined ? 'pass' : 'fail'
-
-    it(`Should ${action} for '${testCase.value}'`, () => {
-      expect(validateDecimals(testCase.value)).toBe(testCase.expected)
-    })
-  })
-})
-
 describe('isPositive', () => {
   const testCases = [
     { value: '1.01', errorMessage: undefined, expected: undefined },