refactor component

resource/locales/en_US/admin/admin.json

@@ -33,8 +33,6 @@
     "port": "Port",
     "user": "User",
     "initialize_mail_settings": "initialize e-mail settings",
-    "initialize_mail_modal_header": "Initialize e-mail settings",
-    "confirm_to_initialize_mail_settings": "You can't restore to the current settings. Are you sure you want to initialize e-mail settings?",
     "ses_settings":"SES settings",
     "aws_settings": "AWS settings",
     "aws_access": "This is for AWS settings. If you complete AWS settings, file upload function, profile picture function etc will be enabled.",

resource/locales/ja_JP/admin/admin.json

@@ -33,8 +33,6 @@
     "port": "ポート",
     "user": "ユーザー",
     "initialize_mail_settings": "設定を初期化",
-    "initialize_mail_modal_header": "メール設定の初期化",
-    "confirm_to_initialize_mail_settings": "一度初期化した設定は戻せません。本当に初期化しますか？",
     "ses_settings":"SES設定",
     "aws_settings": "AWS設定",
     "aws_access": "AWS にアクセスするための設定を行います。AWS の設定を完了させると、ファイルアップロード機能、プロフィール写真機能などが有効になります。",

resource/locales/zh_CN/admin/admin.json

@@ -33,8 +33,6 @@
 		"port": "端口号",
 		"user": "用户名",
     "initialize_mail_settings": "重置邮件设置",
-    "initialize_mail_modal_header": "重置邮件设置",
-    "confirm_to_initialize_mail_settings": "当前设置将被清空且不可恢复。确认重置？",
     "ses_settings":"SES设置",
 		"aws_settings": "AWS设置",
 		"aws_access": "这是用于AWS设置的。如果您完成了AWS设置，文件上传功能，个人资料图片功能等将被启用。",

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

@@ -1,12 +1,9 @@
 
-import React, { useState, useRef } from 'react';
+import React from 'react';
 import PropTypes from 'prop-types';
 import { withTranslation } from 'react-i18next';
 import loggerFactory from '@alias/logger';
 
-import {
-  Modal, ModalHeader, ModalBody,
-} from 'reactstrap';
 import { withUnstatedContainers } from '../../UnstatedUtils';
 import { toastSuccess, toastError } from '../../../util/apiNotification';
 import { withLoadingSppiner } from '../../SuspenseUtils';
@@ -21,22 +18,6 @@ const logger = loggerFactory('growi:smtpSettings');
 function SmtpSetting(props) {
   const { adminAppContainer, t } = props;
 
-  const hostInput = useRef();
-  const portInput = useRef();
-  const userInput = useRef();
-  const passwordInput = useRef();
-
-  const [isInitializeValueModalOpen, setIsInitializeValueModalOpen] = useState(false);
-
-  function openInitializeValueModal() {
-    setIsInitializeValueModalOpen(true);
-
-  }
-
-  function closeInitializeValueModal() {
-    setIsInitializeValueModalOpen(false);
-  }
-
   async function submitHandler() {
     const { t, adminAppContainer } = props;
 
@@ -50,26 +31,6 @@ function SmtpSetting(props) {
     }
   }
 
-  async function initialize() {
-    const { t, adminAppContainer } = props;
-
-    try {
-      const mailSettingParams = await adminAppContainer.initializeSmtpSettingHandler();
-      toastSuccess(t('toaster.initialize_successed', { target: t('admin:app_setting.smtp_settings') }));
-      // convert values to '' if value is null for overwriting values of inputs with refs
-      hostInput.current.value = mailSettingParams.smtpHost || '';
-      portInput.current.value = mailSettingParams.smtpPort || '';
-      userInput.current.value = mailSettingParams.smtpUser || '';
-      passwordInput.current.value = mailSettingParams.smtpPassword || '';
-      closeInitializeValueModal();
-    }
-    catch (err) {
-      toastError(err);
-      logger.error(err);
-    }
-  }
-
-
   return (
     <React.Fragment>
       <div id="mail-smtp" className="tab-pane active mt-5">
@@ -80,7 +41,6 @@ function SmtpSetting(props) {
             <input
               className="form-control"
               type="text"
-              ref={hostInput}
               defaultValue={adminAppContainer.state.smtpHost || ''}
               onChange={(e) => { adminAppContainer.changeSmtpHost(e.target.value) }}
             />
@@ -89,7 +49,6 @@ function SmtpSetting(props) {
             <label>{t('admin:app_setting.port')}</label>
             <input
               className="form-control"
-              ref={portInput}
               defaultValue={adminAppContainer.state.smtpPort || ''}
               onChange={(e) => { adminAppContainer.changeSmtpPort(e.target.value) }}
             />
@@ -102,7 +61,6 @@ function SmtpSetting(props) {
             <input
               className="form-control"
               type="text"
-              ref={userInput}
               defaultValue={adminAppContainer.state.smtpUser || ''}
               onChange={(e) => { adminAppContainer.changeSmtpUser(e.target.value) }}
             />
@@ -112,7 +70,6 @@ function SmtpSetting(props) {
             <input
               className="form-control"
               type="password"
-              ref={passwordInput}
               defaultValue={adminAppContainer.state.smtpPassword || ''}
               onChange={(e) => { adminAppContainer.changeSmtpPassword(e.target.value) }}
             />
@@ -138,26 +95,6 @@ function SmtpSetting(props) {
         </div>
       </div>
 
-
-      <Modal isOpen={isInitializeValueModalOpen} toggle={closeInitializeValueModal} className="initialize-mail-settings">
-        <ModalHeader tag="h4" toggle={closeInitializeValueModal} className="bg-danger text-light">
-          {t('admin:app_setting.initialize_mail_modal_header')}
-        </ModalHeader>
-        <ModalBody>
-          <div className="text-center mb-4">
-            {t('admin:app_setting.confirm_to_initialize_mail_settings')}
-          </div>
-          <div className="text-center my-2">
-            <button type="button" className="btn btn-outline-secondary mr-4" onClick={closeInitializeValueModal}>
-              {t('Cancel')}
-            </button>
-            <button type="button" className="btn btn-danger" onClick={initialize}>
-              {t('Reset')}
-            </button>
-          </div>
-        </ModalBody>
-      </Modal>
-
     </React.Fragment>
   );
 }