refs 114888: complete i18n

packages/app/public/static/locales/en_US/commons.json

@@ -95,6 +95,28 @@
     }
   },
 
+  "questionnaire_modal": {
+    "required": "Required",
+    "answer": "Answer",
+    "close": "Close",
+    "title": "GROWI questionnaire for service improvement",
+    "more_satisfied_services": "We hope that GROWI customers will be even more satisfied",
+    "strive_to_improve_services": "once we improve our services based on your feedback.",
+    "length_of_experience": {
+      "more_than_two_years": "More than 2 years",
+      "one_to_two_years": "More than 1 year but less than 2 years",
+      "six_months_to_one_year": "More than 6 months but less than 1 year",
+      "three_months_to_six_months": "More than 3 months but less than 6 months",
+      "one_month_to_three_months": "More than 1 month but less than 3 months",
+      "less_than_one_month": "Less than 1 month"
+    },
+    "satisfaction_with_growi": "Satisfaction with GROWI",
+    "history_of_growi_usage": "History of GROWI usage",
+    "occupation": "Occupation",
+    "position": "Position",
+    "comment_on_growi": "Comment on GROWI"
+  },
+
   "not_found_page": {
     "page_not_exist": "This page does not exist."
   },

packages/app/public/static/locales/en_US/translation.json

@@ -823,24 +823,8 @@
     "settings": "Questionnaire settings",
     "failed_to_send": "Failed to send feedback",
     "denied": "The questionnaire won't be shown again",
-    "title": "GROWI questionnaire for service improvement",
     "successfully_submitted": "Your survey has been submitted.",
     "thanks_for_answering": "Thank you very much for taking the time to complete the survey.",
-    "more_satisfied_services": "We hope that GROWI customers will be even more satisfied",
-    "strive_to_improve_services": "once we improve our services based on your feedback.",
-    "satisfaction_with_growi": "Satisfaction with GROWI",
-    "history_of_growi_usage": "History of GROWI usage",
-    "occupation": "Occupation",
-    "position": "Position",
-    "comment_on_growi": "Comment on GROWI",
-    "length_of_experience": {
-      "more_than_two_years": "More than 2 years",
-      "one_to_two_years": "More than 1 year but less than 2 years",
-      "six_months_to_one_year": "More than 6 months but less than 1 year",
-      "three_months_to_six_months": "More than 3 months but less than 6 months",
-      "one_month_to_three_months": "More than 1 month but less than 3 months",
-      "less_than_one_month": "Less than 1 month"
-    },
     "personal_settings_explanation": "Questionnaires for improving GROWI will be shown. If you have other feedbacks, you can send them from the user icon dropdown.",
     "enable_questionnaire": "Enable questionnaire",
     "disabled_by_admin": "Questionnaire is disabled by admin"

packages/app/public/static/locales/ja_JP/commons.json

@@ -94,6 +94,28 @@
     }
   },
 
+  "questionnaire_modal": {
+    "required": "必須",
+    "answer": "回答する",
+    "close": "閉じる",
+    "title": "GROWI サービス改善のためのアンケート",
+    "more_satisfied_services": "GROWI をご利用の皆さまに更にご満足いただけるよう",
+    "strive_to_improve_services": "皆さまからのご意見を参考にサービス改善に努めてまいります。",
+    "length_of_experience": {
+      "more_than_two_years": "2年以上",
+      "one_to_two_years": "1年以上2年未満",
+      "six_months_to_one_year": "6ヶ月以上1年未満",
+      "three_months_to_six_months": "3ヶ月以上6ヶ月未満",
+      "one_month_to_three_months": "1ヶ月以上3ヶ月未満",
+      "less_than_one_month": "1ヶ月未満"
+    },
+    "satisfaction_with_growi": "GROWI の満足度",
+    "history_of_growi_usage": "GROWI の利用歴",
+    "occupation": "職種",
+    "position": "役職",
+    "comment_on_growi": "GROWI へのコメント"
+  },
+
   "not_found_page": {
     "page_not_exist": "このページは存在しません。"
   },

packages/app/public/static/locales/ja_JP/translation.json

@@ -821,24 +821,8 @@
     "settings": "アンケート設定",
     "failed_to_send": "回答送信に失敗しました",
     "denied": "このアンケートは今後表示されません",
-    "title": "GROWI サービス改善のためのアンケート",
     "successfully_submitted": "アンケートの送信が完了しました。",
     "thanks_for_answering": "アンケートのご回答誠にありがとうございました。",
-    "more_satisfied_services": "GROWI をご利用の皆さまに更にご満足いただけるよう",
-    "strive_to_improve_services": "皆さまからのご意見を参考にサービス改善に努めてまいります。",
-    "satisfaction_with_growi": "GROWI の満足度",
-    "history_of_growi_usage": "GROWI の利用歴",
-    "occupation": "職種",
-    "position": "役職",
-    "comment_on_growi": "GROWI へのコメント",
-    "length_of_experience": {
-      "more_than_two_years": "2年以上",
-      "one_to_two_years": "1年以上2年未満",
-      "six_months_to_one_year": "6ヶ月以上1年未満",
-      "three_months_to_six_months": "3ヶ月以上6ヶ月未満",
-      "one_month_to_three_months": "1ヶ月以上3ヶ月未満",
-      "less_than_one_month": "1ヶ月未満"
-    },
     "personal_settings_explanation": "GROWI 改善のためのアンケートが表示されるようになります。ご意見ご要望はユーザーアイコンのドロップダウンからお願いいたします。",
     "enable_questionnaire": "アンケートを有効にする",
     "disabled_by_admin": "管理者によってアンケートは無効化されています"

packages/app/public/static/locales/zh_CN/commons.json

@@ -95,6 +95,28 @@
     }
   },
 
+  "questionnaire_modal": {
+    "required": "必需的",
+    "answer": "答案是",
+    "close": "Close",
+    "title": "改善服务的GROWI调查表",
+    "more_satisfied_services": "我们希望让使用GROWI的人更加满意",
+    "strive_to_improve_services": "我们将利用你的反馈来改善我们的服务。",
+    "length_of_experience": {
+      "more_than_two_years": "2年以上",
+      "one_to_two_years": "超过1年但少于2年",
+      "six_months_to_one_year": "超过6个月但少于1年",
+      "three_months_to_six_months": "超过3个月但少于6个月",
+      "one_month_to_three_months": "超过1个月但少于3个月",
+      "less_than_one_month": "不到1个月"
+    },
+    "satisfaction_with_growi": "对GROWI的满意程度",
+    "history_of_growi_usage": "GROWI的使用历史",
+    "occupation": "职位",
+    "position": "职业类型",
+    "comment_on_growi": "关于GROWI的评论"
+  },
+
   "not_found_page": {
     "page_not_exist": "该页面不存在"
   },

packages/app/public/static/locales/zh_CN/translation.json

@@ -822,24 +822,8 @@
     "settings": "问卷设置",
     "failed_to_send": "无法发送反馈",
     "denied": "问卷不会再显示",
-    "title": "改善服务的GROWI调查表",
     "successfully_submitted": "问卷已经发出。",
     "thanks_for_answering": "非常感谢您完成问卷调查。",
-    "more_satisfied_services": "我们希望让使用GROWI的人更加满意",
-    "strive_to_improve_services": "我们将利用你的反馈来改善我们的服务。",
-    "satisfaction_with_growi": "对GROWI的满意程度",
-    "history_of_growi_usage": "GROWI的使用历史",
-    "occupation": "职位",
-    "position": "职业类型",
-    "comment_on_growi": "关于GROWI的评论",
-    "length_of_experience": {
-      "more_than_two_years": "2年以上",
-      "one_to_two_years": "超过1年但少于2年",
-      "six_months_to_one_year": "超过6个月但少于1年",
-      "three_months_to_six_months": "超过3个月但少于6个月",
-      "one_month_to_three_months": "超过1个月但少于3个月",
-      "less_than_one_month": "不到1个月"
-    },
     "personal_settings_explanation": "将展示改进 GROWI 的问卷。 如果您有其他反馈，可以从用户图标下拉菜单中发送。",
     "enable_questionnaire": "启用问卷",
     "disabled_by_admin": "问卷已被管理员禁用"

packages/app/src/components/Questionnaire/ProactiveQuestionnaireModal.tsx

@@ -13,7 +13,7 @@ type ModalProps = {
 };
 
 const QuestionnaireCompletionModal = (props: ModalProps): JSX.Element => {
-  const { t } = useTranslation();
+  const { t } = useTranslation('commons');
 
   const { isOpen, onClose } = props;
 
@@ -27,9 +27,9 @@ const QuestionnaireCompletionModal = (props: ModalProps): JSX.Element => {
       <ModalBody className="bg-primary overflow-hidden p-0" style={{ borderRadius: 8 }}>
         <div className="bg-white m-2 p-4" style={{ borderRadius: 8 }}>
           <div className="text-center">
-            <h2 className="my-4">{t('questionnaire.title')}</h2>
-            <p className="mb-1">{t('questionnaire.successfully_submitted')}</p>
-            <p>{t('questionnaire.thanks_for_answering')}</p>
+            <h2 className="my-4">{t('questionnaire_modal.title')}</h2>
+            <p className="mb-1">{t('questionnaire_modal.successfully_submitted')}</p>
+            <p>{t('questionnaire_modal.thanks_for_answering')}</p>
           </div>
           <div className="text-center my-3">
             <span style={{ cursor: 'pointer', textDecoration: 'underline' }} onClick={onClose}>{t('Close')}</span>
@@ -41,7 +41,7 @@ const QuestionnaireCompletionModal = (props: ModalProps): JSX.Element => {
 };
 
 const ProactiveQuestionnaireModal = (props: ModalProps): JSX.Element => {
-  const { t } = useTranslation();
+  const { t } = useTranslation('commons');
 
   const { isOpen, onClose } = props;
 
@@ -85,14 +85,14 @@ const ProactiveQuestionnaireModal = (props: ModalProps): JSX.Element => {
         <ModalBody className="bg-primary overflow-hidden p-0" style={{ borderRadius: 8 }}>
           <div className="bg-white m-2 p-4" style={{ borderRadius: 8 }}>
             <div className="text-center">
-              <h2 className="my-4">{t('questionnaire.title')}</h2>
-              <p className="mb-1">{t('questionnaire.more_satisfied_services')}</p>
-              <p>{t('questionnaire.strive_to_improve_services')}</p>
+              <h2 className="my-4">{t('questionnaire_modal.title')}</h2>
+              <p className="mb-1">{t('questionnaire_modal.more_satisfied_services')}</p>
+              <p>{t('questionnaire_modal.strive_to_improve_services')}</p>
             </div>
             <form className="px-5" onSubmit={submitHandler}>
               <div className="form-group row mt-5">
                 <label className="col-sm-5 col-form-label" htmlFor="satisfaction">
-                  <span className="badge badge-primary mr-2">{t('Required')}</span>{t('questionnaire.satisfaction_with_growi')}
+                  <span className="badge badge-primary mr-2">{t('questionnaire_modal.required')}</span>{t('questionnaire_modal.satisfaction_with_growi')}
                 </label>
                 <select className="col-sm-7 form-control" name="satisfaction" id="satisfaction" required>
                   <option value="">▼ {t('Select')}</option>
@@ -104,40 +104,40 @@ const ProactiveQuestionnaireModal = (props: ModalProps): JSX.Element => {
                 </select>
               </div>
               <div className="form-group row mt-3">
-                <label className="col-sm-5 col-form-label" htmlFor="lengthOfExperience">{t('questionnaire.history_of_growi_usage')}</label>
+                <label className="col-sm-5 col-form-label" htmlFor="lengthOfExperience">{t('questionnaire_modal.history_of_growi_usage')}</label>
                 <select
                   name="lengthOfExperience"
                   id="lengthOfExperience"
                   className="col-sm-7 form-control"
                 >
                   <option value="">▼ {t('Select')}</option>
-                  <option>{t('questionnaire.length_of_experience.more_than_two_years')}</option>
-                  <option>{t('questionnaire.length_of_experience.one_to_two_years')}</option>
-                  <option>{t('questionnaire.length_of_experience.six_months_to_one_year')}</option>
-                  <option>{t('questionnaire.length_of_experience.three_months_to_six_months')}</option>
-                  <option>{t('questionnaire.length_of_experience.one_month_to_three_months')}</option>
-                  <option>{t('questionnaire.length_of_experience.less_than_one_month')}</option>
+                  <option>{t('questionnaire_modal.length_of_experience.more_than_two_years')}</option>
+                  <option>{t('questionnaire_modal.length_of_experience.one_to_two_years')}</option>
+                  <option>{t('questionnaire_modal.length_of_experience.six_months_to_one_year')}</option>
+                  <option>{t('questionnaire_modal.length_of_experience.three_months_to_six_months')}</option>
+                  <option>{t('questionnaire_modal.length_of_experience.one_month_to_three_months')}</option>
+                  <option>{t('questionnaire_modal.length_of_experience.less_than_one_month')}</option>
                 </select>
               </div>
               <div className="form-group row mt-3">
-                <label className="col-sm-5 col-form-label" htmlFor="occupation">{t('questionnaire.occupation')}</label>
+                <label className="col-sm-5 col-form-label" htmlFor="occupation">{t('questionnaire_modal.occupation')}</label>
                 <input className="col-sm-7 form-control" type="text" name="occupation" id="occupation" />
               </div>
               <div className="form-group row mt-3">
-                <label className="col-sm-5 col-form-label" htmlFor="position">{t('questionnaire.position')}</label>
+                <label className="col-sm-5 col-form-label" htmlFor="position">{t('questionnaire_modal.position')}</label>
                 <input className="col-sm-7 form-control" type="text" name="position" id="position" />
               </div>
               <div className="form-group row mt-3">
                 <label className="col-sm-5 col-form-label" htmlFor="commentText">
-                  <span className="badge badge-primary mr-2">{t('Required')}</span>{t('questionnaire.comment_on_growi')}
+                  <span className="badge badge-primary mr-2">{t('questionnaire_modal.required')}</span>{t('questionnaire_modal.comment_on_growi')}
                 </label>
                 <textarea className="col-sm-7 form-control" name="commentText" id="commentText" rows={5} required/>
               </div>
               <div className="text-center mt-5">
-                <button type="submit" className="btn btn-primary">{t('questionnaire.answer')}</button>
+                <button type="submit" className="btn btn-primary">{t('questionnaire_modal.answer')}</button>
               </div>
               <div className="text-center my-3">
-                <span style={{ cursor: 'pointer', textDecoration: 'underline' }} onClick={onClose}>{t('Close')}</span>
+                <span style={{ cursor: 'pointer', textDecoration: 'underline' }} onClick={onClose}>{t('questionnaire_modal.close')}</span>
               </div>
             </form>
           </div>

packages/app/src/components/Questionnaire/QuestionnaireModal.tsx

@@ -28,7 +28,7 @@ const QuestionnaireModal = ({ questionnaireOrder }: QuestionnaireModalProps): JS
 
   const inputNamePrefix = 'question-';
 
-  const { t } = useTranslation();
+  const { t } = useTranslation(['translation', 'commons']);
 
   const sendAnswer = useCallback(async(answers: IAnswer[]) => {
     try {
@@ -112,8 +112,8 @@ const QuestionnaireModal = ({ questionnaireOrder }: QuestionnaireModalProps): JS
         <div className="bg-white m-2 p-4" style={{ borderRadius: 8 }}>
           <div className="text-center mb-2">
             <h2 className="my-4">{questionnaireOrderTitle}</h2>
-            <p className="mb-1">{t('questionnaire.more_satisfied_services')}</p>
-            <p>{t('questionnaire.strive_to_improve_services')}</p>
+            <p className="mb-1">{t('commons:questionnaire_modal.more_satisfied_services')}</p>
+            <p>{t('commons:questionnaire_modal.strive_to_improve_services')}</p>
           </div>
           <div className="container">
             <div className="row mt-4">