Skip to content

Commit

Permalink
Reduce code duplication in form modal inputs
Browse files Browse the repository at this point in the history
Formerly the code for the password input field was entirely duplicated
from the code for the password and duration fields.  This refactors that
slightly so the input type can be configured in the same way, but it
only uses the code for it once.
  • Loading branch information
PtrTeixeira committed Feb 17, 2017
1 parent 919d0e7 commit 8fd7b08
Showing 1 changed file with 8 additions and 17 deletions.
25 changes: 8 additions & 17 deletions BaragonUI/app/components/common/modal/FormModal.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -25,6 +25,7 @@ function getDefaultFormState(props) {
return formState;
}


export default class FormModal extends React.Component {
constructor(props) {
super(props);
Expand Down Expand Up @@ -270,6 +271,11 @@ export default class FormModal extends React.Component {
extraHelp = 'Accepts any English duration (Days, Hr, Min...)';
}

let isPassword = false;
if (formElement.type === FormModal.INPUT_TYPES.PASSWORD) {
isPassword = true;
}

switch (formElement.type) {

case FormModal.INPUT_TYPES.BOOLEAN:
Expand All @@ -292,29 +298,14 @@ export default class FormModal extends React.Component {
</FormModal.FormItem>
);

case FormModal.INPUT_TYPES.PASSWORD:
return (
<FormModal.FormItem element={formElement} formState={this.state.formState} key={formElement.name}>
<div className={classNames('form-group', {'has-error': !!error})}>
<label className="control-label" htmlFor={formElement.name}>{formElement.label}</label>
<input
type="password"
name={formElement.name}
className="form-control input-large"
value={this.state.formState[formElement.name] || ''}
onChange={(event) => this.handleFormChange(formElement.name, event.target.value)}
/>
</div>
</FormModal.FormItem>
);

case FormModal.INPUT_TYPES.DURATION:
case FormModal.INPUT_TYPES.STRING:
case FormModal.INPUT_TYPES.PASSWORD:
return (
<FormModal.FormItem element={formElement} formState={this.state.formState} key={formElement.name}>
<div className={classNames('form-group', {'has-error': !!error})}>
<label className="control-label" htmlFor={formElement.name}>{formElement.label}</label>
<input type="text"
<input type={isPassword ? 'password' : 'text'}
name={formElement.name}
className="form-control input-large"
value={this.state.formState[formElement.name] || ''}
Expand Down

0 comments on commit 8fd7b08

Please sign in to comment.