tyler.durden
/
opensupports
mirror of https://github.com/opensupports/opensupports.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

[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
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

75
client/src/app/admin/panel/settings/admin-panel-email-settings.js
View File

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

13
client/src/core-components/form.js
View File

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

1
client/src/data/languages/en.js
View File

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