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

@@ -5,65 +5,66 @@ import RuleFieldShape from './RuleFieldShape'
 import ProfileFieldShape from './ProfileFieldShape'
 
 class ProfileField extends Component {
-  componentDidUpdate() {
-    const { field, data, onFieldUpdate } = this.props
-    if (data.focus && this.el) {
-      this.el.focus()
-      onFieldUpdate({ [field.name]: { ...data, focus: false } })
+    componentDidUpdate() {
+        const { field, data, onFieldUpdate } = this.props
+        if (data.focus && this.el) {
+            this.el.focus()
+            onFieldUpdate({
+                [field.name]: {...data, focus: false } })
+        }
     }
-  }
 
-  handleChange = e => {
-    const { field, data, onFieldUpdate } = this.props
-    const { value } = e.target
+    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)
+        const error = data.touched ? applyValidation(field, value) : null
+        const maskedValue = applyMask(field, value)
 
-    onFieldUpdate({ [field.name]: { ...data, value: maskedValue, error } })
-  }
-
-  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