[DEV-214] Fix email template validation (#1136)

* Fix email template validation

* Fix bug with default email templates

* Use template codes instead of selected index in text3 email template field

* Fix bug in no email template forms

* Use componentDidUpdate method
This commit is contained in:
LautaroCesso 2022-04-19 19:28:51 -03:00 committed by GitHub
parent 83b8e8094b
commit 861f7dc254
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 58 additions and 31 deletions

View File

@ -179,12 +179,9 @@ class AdminPanelEmailSettings extends React.Component {
}
renderForm() {
const {
form,
language,
selectedIndex,
edited
} = this.state;
const { form, language, selectedIndex, edited } = this.state;
const { template, text2, text3} = form;
return (
<div className="col-md-9">
<FormField label={i18n('LANGUAGE')} decorator={LanguageSelector} value={language}
@ -196,22 +193,47 @@ class AdminPanelEmailSettings extends React.Component {
<Form {...this.getFormProps()}>
<div className="row">
<div className="col-md-7">
<FormField label={i18n('SUBJECT')} name="subject" validation="TITLE" required
fieldProps={{size: 'large'}} />
<FormField
fieldProps={{size: 'large'}}
label={i18n('SUBJECT')}
name="subject"
validation="TITLE"
required />
</div>
</div>
<FormField key="text1" label={i18n('TEXT') + '1'} name="text1" validation="TEXT_AREA" required
decorator={'textarea'}
fieldProps={{className: 'admin-panel-email-settings__text-area'}} />
{(form.text2 || form.text2 === "") ?
<FormField key="text2" label={i18n('TEXT') + '2'} name="text2" validation="TEXT_AREA" required
decorator={'textarea'}
fieldProps={{className: 'admin-panel-email-settings__text-area'}} /> : null}
{(form.text3 || form.text3 === "") ?
<FormField key="text3" label={i18n('TEXT') + '3'} name="text3" validation="TEXT_AREA" required
decorator={'textarea'}
fieldProps={{className: 'admin-panel-email-settings__text-area'}} /> : null}
<FormField
fieldProps={{className: 'admin-panel-email-settings__text-area'}}
label={i18n('TEXT') + '1'}
key="text1"
name="text1"
validation="TEXT_AREA"
required
decorator={'textarea'} />
{
(text2 || text2 === "") ?
<FormField
fieldProps={{className: 'admin-panel-email-settings__text-area'}}
label={i18n('TEXT') + '2'}
key="text2"
name="text2"
validation="TEXT_AREA"
required
decorator={'textarea'} /> :
null
}
{
((text3 || text3 === "") && (template !== "USER_PASSWORD" && template !== "USER_EMAIL")) ?
<FormField
fieldProps={{className: 'admin-panel-email-settings__text-area'}}
label={i18n('TEXT') + '3'}
key="text3"
name="text3"
validation={(template !== "USER_PASSWORD" && template !== "USER_EMAIL") ? "TEXT_AREA" : ""}
required={(template !== "USER_PASSWORD" && template !== "USER_EMAIL")}
decorator={'textarea'} /> :
null
}
<div className="admin-panel-email-settings__actions">
<div className="admin-panel-email-settings__optional-buttons">
@ -223,11 +245,7 @@ class AdminPanelEmailSettings extends React.Component {
{edited ? this.renderDiscardButton() : null}
</div>
<div className="admin-panel-email-settings__save-button">
<SubmitButton
key="submit-email-template"
type="secondary"
size="small"
onClick={(e) => {e.preventDefault(); this.onFormSubmit(form);}}>
<SubmitButton key="submit-email-template" type="secondary" size="small">
{i18n('SAVE')}
</SubmitButton>
</div>
@ -257,16 +275,19 @@ class AdminPanelEmailSettings extends React.Component {
}
getFormProps() {
const { form, errors, loadingForm } = this.state;
return {
values: this.state.form,
errors: this.state.errors,
loading: this.state.loadingForm,
values: form,
errors,
loading: loadingForm,
onChange: (form) => {
this.setState({form, edited: true})
},
onValidateErrors: (errors) => {
this.setState({errors})
},
onSubmit: this.onFormSubmit.bind(this, form)
}
}

View File

@ -39,7 +39,13 @@ class Form extends React.Component {
}
componentDidMount() {
this.setState(this.getInitialFormAndValidations());
this.setState(this.getInitialFormAndValidations(this.props.children));
}
componentDidUpdate(nextProps) {
if(nextProps.values != this.props.values) {
this.setState(this.getInitialFormAndValidations(nextProps.children));
}
}
render() {
@ -135,12 +141,11 @@ class Form extends React.Component {
return newErrors;
}
getInitialFormAndValidations() {
getInitialFormAndValidations(children) {
let form = {};
let validations = {};
reactDFS(this.props.children, (child) => {
reactDFS(children, (child) => {
if (this.isValidField(child)) {
form[child.props.name] = child.props.value || FormField.getDefaultValue(child.props.field);

View File

@ -225,6 +225,7 @@ export default {
'NEW_CUSTOM_FIELD': 'New Custom field',
'TYPE': 'Type',
'SELECT_INPUT': 'Select input',
'TEXT': 'Text',
'TEXT_INPUT': 'Text input',
'OPTION': 'Option {index}',
'OPTIONS': 'Options',