Solve the problem of the document field (CPF) blocking even with the empty document.

CHANGELOG.md

@@ -6,7 +6,7 @@ The format is based on [Keep a Changelog](http://keepachangelog.com/en/1.0.0/)
 and this project adheres to [Semantic Versioning](http://semver.org/spec/v2.0.0.html).
 
 ## [Unreleased]
-
+- Added verification if the user's document is empty not only null 
 - Added prop `blockDocument` to Enables or disables editing the document field in my account
 ## [2.9.3] - 2021-01-11
 

react/ProfileField.js

@@ -9,61 +9,60 @@ class ProfileField extends Component {
     const { field, data, onFieldUpdate } = this.props
     if (data.focus && this.el) {
       this.el.focus()
-      onFieldUpdate({ [field.name]: { ...data, focus: false } })
+      onFieldUpdate({[field.name]: {...data, focus: false } })
     }
-  }
-
-  handleChange = e => {
-    const { field, data, onFieldUpdate } = this.props
-    const { value } = e.target
+}
 
-    const error = data.touched ? applyValidation(field, value) : null
-    const maskedValue = applyMask(field, value)
+handleChange = e => {
+  const { field, data, onFieldUpdate } = this.props
+  const { value } = e.target
 
-    onFieldUpdate({ [field.name]: { ...data, value: maskedValue, error } })
-  }
+  const error = data.touched ? applyValidation(field, value) : null
+  const maskedValue = applyMask(field, value)
 
-  handleBlur = () => {
-    const { field, data, onFieldUpdate } = this.props
-    const error = applyValidation(field, data.value)
+  onFieldUpdate({ [field.name]: {...data, value: maskedValue, error } })
+}
 
-    onFieldUpdate({ [field.name]: { ...data, touched: true, error } })
-  }
+handleBlur = () => {
+  const { field, data, onFieldUpdate } = this.props
+  const error = applyValidation(field, data.value)
 
-  inputRef = el => {
-    this.el = el
-  }
+  onFieldUpdate({ [field.name]: {...data, touched: true, error } })
+}
 
-  render() {
-      const { field, data, options, Input, userProfile, blockDocument } = this.props
+inputRef = el => {
+  this.el = el
+}
 
-    if(blockDocument && field.name === 'document' && userProfile['document'].value !== null){
-      field.disabled = true      
+render() {
+    const { field, data, options, Input, userProfile, blockDocument } = this.props
+
+    if (blockDocument && field.name === 'document' && (userProfile['document'].value !== null && userProfile['document'].value !== "")) {
+        field.disabled = true
     }
-    return (
-      <Input
-        field={field}
-        data={data}
-        options={options}
-        inputRef={this.inputRef}
-        onChange={this.handleChange}
-        onBlur={this.handleBlur}
-      />
+    return ( <
+        Input field = { field }
+        data = { data }
+        options = { options }
+        inputRef = { this.inputRef }
+        onChange = { this.handleChange }
+        onBlur = { this.handleBlur }
+        />
     )
-  }
+}
 }
 
 ProfileField.propTypes = {
-  /** Rules for the field this component represents */
-  field: RuleFieldShape.isRequired,
-  /** Data to be displayed by this component */
-  data: ProfileFieldShape.isRequired,
-  /** Additional options to modify this input */
-  options: PropTypes.object,
-  /** Function to be called when data changes */
-  onFieldUpdate: PropTypes.func.isRequired,
-  /** Component to be used as input for the field */
-  Input: PropTypes.func.isRequired,
+    /** Rules for the field this component represents */
+    field: RuleFieldShape.isRequired,
+    /** Data to be displayed by this component */
+    data: ProfileFieldShape.isRequired,
+    /** Additional options to modify this input */
+    options: PropTypes.object,
+    /** Function to be called when data changes */
+    onFieldUpdate: PropTypes.func.isRequired,
+    /** Component to be used as input for the field */
+    Input: PropTypes.func.isRequired,
 }
 
-export default ProfileField
+export default ProfileField