removed hasError boolean from form elements

HenriRabalais · Nov 6, 2024 · bbe01bf · bbe01bf
1 parent 38266d4
commit bbe01bf
Show file tree

Hide file tree

Showing 19 changed files with 56 additions and 135 deletions.
diff --git a/jsx/Form.d.ts b/jsx/Form.d.ts
@@ -108,8 +108,7 @@ type selectElementProps = {
     required?: boolean
     emptyOption?: boolean
     autoSelect?: boolean
-    hasError?: boolean
-    errorMessage?: boolean
+    errorMessage?: string
     onUserInput: (name: string, value: any) => void
     noMargins?: boolean
     placeholder?: string
@@ -306,7 +305,6 @@ type fileElementProps = {
     disabled?: boolean
     required?: boolean
     allowMultiple?: boolean
-    hasError?: boolean
     errorMessage?: string
     onUserInput: (name: string, value: any) => void
 };
@@ -407,7 +405,6 @@ type dateElementProps = {
     dateFormat?: string
     disabled?: boolean
     required?: boolean
-    hasError?: boolean
     errorMessage?: string
     onUserInput: (name: string, value: any) => void
 };
@@ -595,7 +592,7 @@ type radioElementProps = {
     required?: boolean
     vertical?: boolean
     checked: boolean
-    errorMessage?: boolean
+    errorMessage?: string
     elementClass?: boolean
     onUserInput: (name: string, value: any) => void
 }

diff --git a/jsx/Form.js b/jsx/Form.js
@@ -451,7 +451,7 @@ SearchableDropdown.defaultProps = {
   disabled: false,
   required: false,
   sortByValue: true,
-  errorMessage: '',
+  errorMessage: null,
   placeHolder: '',
   onUserInput: function() {
     console.warn('onUserInput() callback is not set');
@@ -554,7 +554,7 @@ export class SelectElement extends Component {
     }
 
     // Add error message
-    if (this.props.hasError
+    if (this.props.errorMessage
        || (this.props.required && this.props.value === '')
     ) {
       errorMessage = <span>{this.props.errorMessage}</span>;
@@ -660,7 +660,6 @@ SelectElement.propTypes = {
   required: PropTypes.bool,
   emptyOption: PropTypes.bool,
   autoSelect: PropTypes.bool,
-  hasError: PropTypes.bool,
   errorMessage: PropTypes.string,
   onUserInput: PropTypes.func,
   noMargins: PropTypes.bool,
@@ -680,8 +679,7 @@ SelectElement.defaultProps = {
   sortByValue: true,
   emptyOption: true,
   autoSelect: true,
-  hasError: false,
-  errorMessage: 'The field is required!',
+  errorMessage: null,
   onUserInput: function() {
     console.warn('onUserInput() callback is not set');
   },
@@ -978,11 +976,10 @@ TagsElement.defaultProps = {
   required: false,
   disabled: false,
   emptyOption: true,
-  hasError: false,
   allowDupl: false,
   useSearch: false,
   strictSearch: false, // only accept items specified in options
-  errorMessage: '',
+  errorMessage: null,
   pendingValKey: '',
   btnLabel: 'Add Tag',
   onUserInput: function() {
@@ -1213,7 +1210,7 @@ TextboxElement.defaultProps = {
   autoComplete: null,
   disabled: false,
   required: false,
-  errorMessage: '',
+  errorMessage: null,
   onUserInput: function() {
     console.warn('onUserInput() callback is not set');
   },
@@ -1345,7 +1342,7 @@ EmailElement.defaultProps = {
   autoComplete: null,
   disabled: false,
   required: false,
-  errorMessage: '',
+  errorMessage: null,
   onUserInput: function() {
     console.warn('onUserInput() callback is not set');
   },
@@ -1506,7 +1503,7 @@ PasswordElement.defaultProps = {
   disabled: false,
   required: false,
   autoComplete: null,
-  errorMessage: '',
+  errorMessage: null,
   onUserInput: function() {
     console.warn('onUserInput() callback is not set');
   },
@@ -1560,7 +1557,7 @@ export class DateElement extends Component {
     }
 
     // Add error message
-    if (this.props.hasError
+    if (this.props.errorMessage
        || (this.props.required && this.props.value === '')
     ) {
       errorMessage = <span>{this.props.errorMessage}</span>;
@@ -1640,7 +1637,6 @@ DateElement.propTypes = {
   dateFormat: PropTypes.string,
   disabled: PropTypes.bool,
   required: PropTypes.bool,
-  hasError: PropTypes.bool,
   errorMessage: PropTypes.string,
   onUserInput: PropTypes.func,
 };
@@ -1655,8 +1651,7 @@ DateElement.defaultProps = {
   dateFormat: 'YMd',
   disabled: false,
   required: false,
-  hasError: false,
-  errorMessage: 'The field is required!',
+  errorMessage: null,
   onUserInput: function() {
     console.warn('onUserInput() callback is not set');
   },
@@ -2039,7 +2034,7 @@ export class FileElement extends Component {
     };
 
     // Add error message
-    if (this.props.hasError) {
+    if (this.props.errorMessage) {
       errorMessage = this.props.errorMessage;
       elementClass = 'row form-group has-error';
     }
@@ -2125,7 +2120,6 @@ FileElement.propTypes = {
   disabled: PropTypes.bool,
   required: PropTypes.bool,
   allowMultiple: PropTypes.bool,
-  hasError: PropTypes.bool,
   errorMessage: PropTypes.string,
   onUserInput: PropTypes.func,
 };
@@ -2138,8 +2132,7 @@ FileElement.defaultProps = {
   disabled: false,
   required: false,
   allowMultiple: false,
-  hasError: false,
-  errorMessage: 'The field is required!',
+  errorMessage: null,
   onUserInput: function() {
     console.warn('onUserInput() callback is not set');
   },
@@ -2396,7 +2389,7 @@ CheckboxElement.defaultProps = {
   id: null,
   disabled: false,
   required: false,
-  errorMessage: '',
+  errorMessage: null,
   offset: 'col-sm-offset-3',
   class: 'checkbox-inline',
   elementClass: 'checkbox-inline col-sm-offset-3',
@@ -2760,7 +2753,7 @@ RadioElement.defaultProps = {
   disabled: false,
   required: false,
   vertical: false,
-  errorMessage: '',
+  errorMessage: null,
   elementClass: 'row form-group',
   onUserInput: function() {
     console.warn('onUserInput() callback is not set');
@@ -2905,7 +2898,7 @@ SliderElement.defaultProps = {
   maxWidth: 'auto',
   disabled: false,
   required: false,
-  errorMessage: '',
+  errorMessage: null,
   elementClass: 'row form-group',
   onUserInput: function() {
     console.warn('onUserInput() callback is not set');

diff --git a/jsx/form/DateTimePartialElement.tsx b/jsx/form/DateTimePartialElement.tsx
@@ -137,7 +137,6 @@ interface DateTimePartialElementProps {
   dateFormat: string;
   required?: boolean;
   disabled?: boolean;
-  hasError?: boolean;
   errorMessage?: string;
   onUserInput: (name: string, value: string) => void;
 }
@@ -185,7 +184,7 @@ function DateTimePartialElement(props: DateTimePartialElementProps) {
   if (props.required && value == '') {
     errorMessage = <span>This field is required</span>;
     elementClass += ' has-error';
-  } else if (props.hasError) {
+  } else if (props.errorMessage) {
     errorMessage = <span>{props.errorMessage}</span>;
     elementClass += ' has-error';
   }

diff --git a/modules/battery_manager/jsx/batteryManagerForm.js b/modules/battery_manager/jsx/batteryManagerForm.js
@@ -68,7 +68,6 @@ class BatteryManagerForm extends Component {
           required={true}
           value={test.testName}
           errorMessage={errors.testName}
-          hasError={errors.testName}
         />
         <NumericElement
           name="ageMinDays"
@@ -79,7 +78,6 @@ class BatteryManagerForm extends Component {
           required={true}
           value={test.ageMinDays}
           errorMessage={errors.ageMinDays}
-          hasError={errors.ageMinDays}
         />
         <NumericElement
           name="ageMaxDays"
@@ -90,7 +88,6 @@ class BatteryManagerForm extends Component {
           required={true}
           value={test.ageMaxDays}
           errorMessage={errors.ageMaxDays}
-          hasError={errors.ageMaxDays}
         />
         <SelectElement
           name="stage"
@@ -100,7 +97,6 @@ class BatteryManagerForm extends Component {
           required={true}
           value={test.stage}
           errorMessage={errors.stage}
-          hasError={errors.stage}
         />
         <SelectElement
           name="cohort"

diff --git a/modules/conflict_resolver/jsx/fix_conflict_form.js b/modules/conflict_resolver/jsx/fix_conflict_form.js
@@ -32,7 +32,7 @@ class FixConflictForm extends Component {
     this.state = {
       value: null,
       success: false,
-      error: false,
+      error: null,
       emptyOption: true,
     };
 
@@ -68,11 +68,11 @@ class FixConflictForm extends Component {
         if (json.error) {
           throw json.error;
         }
-        this.setState({success: true, error: false, emptyOption: false, value});
+        this.setState({success: true, error: null, emptyOption: false, value});
       })
       .catch((error) => {
         swal('Error!', error, 'error');
-        this.setState({error: true, success: false, emptyOption: true});
+        this.setState({error, success: false, emptyOption: true});
       });
   }
 
@@ -95,8 +95,7 @@ class FixConflictForm extends Component {
           onUserInput={this.resolveConflict}
           options={this.props.options}
           emptyOption={emptyOption}
-          hasError={error}
-          errorMessage={''}
+          errorMessage={error}
           noMargins={true}
         />
       </td>

diff --git a/modules/data_release/jsx/addPermissionForm.js b/modules/data_release/jsx/addPermissionForm.js
@@ -25,7 +25,6 @@ class AddPermissionForm extends Component {
       data: {},
       fieldOptions: {},
       formData: {},
-      hasError: {},
       errorMessage: {},
       isLoaded: false,
       loadedData: 0,
@@ -95,7 +94,6 @@ class AddPermissionForm extends Component {
           options={this.state.fieldOptions.users}
           onUserInput={this.setFormData}
           ref='userid'
-          hasError={this.state.hasError.Username}
           errorMessage={this.state.errorMessage.Username}
           required={true}
           value={this.state.formData.userid}
@@ -107,7 +105,6 @@ class AddPermissionForm extends Component {
           options={this.state.fieldOptions.filenames}
           onUserInput={this.setFormData}
           ref='data_release_id'
-          hasError={this.state.hasError.Filename}
           errorMessage={this.state.errorMessage.Filename}
           required={false}
           value={this.state.formData.data_release_id}
@@ -120,7 +117,6 @@ class AddPermissionForm extends Component {
           options={this.state.fieldOptions.versions}
           onUserInput={this.setFormData}
           ref='data_release_version'
-          hasError={this.state.hasError.Version}
           errorMessage={this.state.errorMessage.Version}
           required={false}
           value={this.state.formData.data_release_version}
@@ -208,16 +204,9 @@ class AddPermissionForm extends Component {
       Version: undefined,
     };
 
-    let hasError = {
-      Username: false,
-      Filename: false,
-      Version: false,
-    };
-
     // make sure a user was selected
     if (!formData.userid) {
       errorMessage.Username = 'You must select a user!';
-      hasError.Username = true;
       isValid = false;
     }
 
@@ -227,12 +216,10 @@ class AddPermissionForm extends Component {
       let msg = 'You must select a file OR a version to grant permission on!';
       errorMessage.Filename = msg;
       errorMessage.Version = msg;
-      hasError.Filename = true;
-      hasError.Version = true;
       isValid = false;
     }
 
-    this.setState({errorMessage, hasError});
+    this.setState({errorMessage});
     return isValid;
   }
 }

diff --git a/modules/data_release/jsx/managePermissionsForm.js b/modules/data_release/jsx/managePermissionsForm.js
@@ -26,7 +26,6 @@ class ManagePermissionsForm extends Component {
     this.state = {
       data: {},
       originalData: {},
-      hasError: {},
       errorMessage: {},
       isLoaded: false,
     };

diff --git a/modules/data_release/jsx/uploadFileForm.js b/modules/data_release/jsx/uploadFileForm.js
@@ -29,7 +29,6 @@ class UploadFileForm extends Component {
       formData: {},
       uploadResult: null,
       errorMessage: {},
-      hasError: {},
       isLoaded: false,
       uploadProgress: -1,
     };
@@ -127,22 +126,15 @@ class UploadFileForm extends Component {
       Filesize: undefined,
     };
 
-    let hasError = {
-      Filename: undefined,
-      Filesize: undefined,
-    };
-
     if (!formData.file) {
       errorMessage.Filename = 'You must select a file to upload';
-      hasError.Filename = true;
-      this.setState({errorMessage, hasError});
+      this.setState({errorMessage});
       return;
     }
 
     if (!formData.project) {
       errorMessage.Project = 'You must select a project';
-      hasError.Project = true;
-      this.setState({errorMessage, hasError});
+      this.setState({errorMessage});
       return;
     }
 
@@ -154,14 +146,13 @@ class UploadFileForm extends Component {
                 + maxSizeAllowed
                 + ')';
       errorMessage['Filesize'] = msg;
-      hasError['Filesize'] = true;
       swal.fire({
         title: 'Error',
         text: msg,
         type: 'error',
         showCancelButton: true,
       });
-      this.setState({errorMessage, hasError});
+      this.setState({errorMessage});
       return;
     }