Merge pull request #1120 from weseek/imprv/reactify-admin-full-text-search-management-4

Reactify Full Text Search Management Page

resource/locales/en-US/translation.json

@@ -736,5 +736,13 @@
     "import": "Import",
     "page_skip": "Pages with a name that already exists on GROWI are not imported",
     "Directory_hierarchy_tag": "Directory Hierarchy Tag"
+  },
+
+  "full_text_search_management":{
+    "elasticsearch_management":"Elasticsearch Management",
+    "build_button":"Rebuild Index",
+    "rebuild_description_1":"Force rebuild index.",
+    "rebuild_description_2":"Click 'Build Now' to delete and create mapping file and add all pages.",
+    "rebuild_description_3":"This may take a while."
   }
 }

resource/locales/ja/translation.json

@@ -721,5 +721,13 @@
     "import": "インポート",
     "page_skip": "既に GROWI 側に同名のページが存在する場合、そのページはスキップされます",
     "Directory_hierarchy_tag": "ディレクトリ階層タグ"
+  },
+
+  "full_text_search_management":{
+    "elasticsearch_management":"Elasticsearch 管理",
+    "build_button":"インデックスのリビルド",
+    "rebuild_description_1":"Build Now ボタンを押すと全てのページのインデックスを削除し、作り直します。",
+    "rebuild_description_2":"この作業には数秒かかります。",
+    "rebuild_description_3":""
   }
 }

src/client/js/app.js

@@ -206,7 +206,9 @@ if (adminFullTextSearchManagementElem != null) {
 
   ReactDOM.render(
     <Provider inject={[appContainer]}>
-      <FullTextSearchManagement />
+      <I18nextProvider i18n={i18n}>
+        <FullTextSearchManagement />
+      </I18nextProvider>
     </Provider>,
     adminFullTextSearchManagementElem,
   );

src/client/js/components/Admin/FullTextSearchManagement/FullTextSearchPage.jsx

@@ -1,5 +1,6 @@
 import React, { Fragment } from 'react';
 import PropTypes from 'prop-types';
+import { withTranslation } from 'react-i18next';
 
 import AppContainer from '../../../services/AppContainer';
 
@@ -35,11 +36,24 @@ class FullTextSearchManagement extends React.Component {
   }
 
   render() {
+    const { t } = this.props;
+
     return (
       <Fragment>
-        <div>
-          <button type="submit" className="btn btn-inverse" onClick={this.buildIndex}>Build Now</button>
-        </div>
+        <fieldset className="pr-3">
+          <legend> { t('full_text_search_management.elasticsearch_management') } </legend>
+          <div className="form-group form-horizontal">
+            <div className="col-xs-3 control-label"></div>
+            <div className="col-xs-7">
+              <button type="submit" className="btn btn-inverse" onClick={this.buildIndex}>{ t('full_text_search_management.build_button') }</button>
+              <p className="help-block">
+                { t('full_text_search_management.rebuild_description_1') }<br />
+                { t('full_text_search_management.rebuild_description_2') }<br />
+                { t('full_text_search_management.rebuild_description_3') }<br />
+              </p>
+            </div>
+          </div>
+        </fieldset>
       </Fragment>
     );
   }
@@ -51,7 +65,8 @@ const FullTextSearchManagementWrapper = (props) => {
 };
 
 FullTextSearchManagement.propTypes = {
+  t: PropTypes.func.isRequired, // i18next
   appContainer: PropTypes.instanceOf(AppContainer).isRequired,
 };
 
-export default FullTextSearchManagementWrapper;
+export default withTranslation()(FullTextSearchManagementWrapper);