Merge pull request #2654 from weseek/imprv/reset-form-when-initialize-meil-settings

reset-form-when-initialize-meil-settings

src/client/js/components/Admin/App/MailSetting.jsx

@@ -21,6 +21,12 @@ class MailSetting extends React.Component {
       isInitializeValueModalOpen: false,
     };
 
+    this.emailInput = React.createRef();
+    this.hostInput = React.createRef();
+    this.portInput = React.createRef();
+    this.userInput = React.createRef();
+    this.passwordInput = React.createRef();
+
     this.openInitializeValueModal = this.openInitializeValueModal.bind(this);
     this.closeInitializeValueModal = this.closeInitializeValueModal.bind(this);
     this.submitHandler = this.submitHandler.bind(this);
@@ -52,8 +58,14 @@ class MailSetting extends React.Component {
     const { t, adminAppContainer } = this.props;
 
     try {
-      await adminAppContainer.initializeMailSettingHandler();
+      const mailSettingParams = await adminAppContainer.initializeMailSettingHandler();
       toastSuccess(t('toaster.initialize_successed', { target: t('admin:app_setting.mail_settings') }));
+      // convert values to '' if value is null for overwriting values of inputs with refs
+      this.emailInput.current.value = mailSettingParams.fromAddress || '';
+      this.hostInput.current.value = mailSettingParams.smtpHost || '';
+      this.portInput.current.value = mailSettingParams.smtpPort || '';
+      this.userInput.current.value = mailSettingParams.smtpUser || '';
+      this.passwordInput.current.value = mailSettingParams.smtpPassword || '';
       this.closeInitializeValueModal();
     }
     catch (err) {
@@ -74,6 +86,7 @@ class MailSetting extends React.Component {
             <input
               className="form-control"
               type="text"
+              ref={this.emailInput}
               placeholder={`${t('eg')} mail@growi.org`}
               defaultValue={adminAppContainer.state.fromAddress || ''}
               onChange={(e) => { adminAppContainer.changeFromAddress(e.target.value) }}
@@ -88,6 +101,7 @@ class MailSetting extends React.Component {
             <input
               className="form-control"
               type="text"
+              ref={this.hostInput}
               defaultValue={adminAppContainer.state.smtpHost || ''}
               onChange={(e) => { adminAppContainer.changeSmtpHost(e.target.value) }}
             />
@@ -96,6 +110,7 @@ class MailSetting extends React.Component {
             <label>{t('admin:app_setting.port')}</label>
             <input
               className="form-control"
+              ref={this.portInput}
               defaultValue={adminAppContainer.state.smtpPort || ''}
               onChange={(e) => { adminAppContainer.changeSmtpPort(e.target.value) }}
             />
@@ -108,6 +123,7 @@ class MailSetting extends React.Component {
             <input
               className="form-control"
               type="text"
+              ref={this.userInput}
               defaultValue={adminAppContainer.state.smtpUser || ''}
               onChange={(e) => { adminAppContainer.changeSmtpUser(e.target.value) }}
             />
@@ -117,6 +133,7 @@ class MailSetting extends React.Component {
             <input
               className="form-control"
               type="password"
+              ref={this.passwordInput}
               defaultValue={adminAppContainer.state.smtpPassword || ''}
               onChange={(e) => { adminAppContainer.changeSmtpPassword(e.target.value) }}
             />

src/client/js/services/AdminAppContainer.js

@@ -278,6 +278,7 @@ export default class AdminAppContainer extends Container {
       mailSettingParams,
     } = response.data;
     this.setState(mailSettingParams);
+    return mailSettingParams;
   }
 
   /**