internationalization

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

@@ -68,6 +68,19 @@
     "feedback": "Feedback"
   },
 
+  "create_page_dropdown": {
+    "new_page": "Create New Page",
+    "todays": {
+      "desc": "Create today's ...",
+      "memo": "memo"
+    },
+    "template": {
+      "desc": "Create/Edit template page",
+      "children": "Template for children",
+      "descendants": "Template for descendants"
+    }
+  },
+
   "copy_to_clipboard": {
     "Copy to clipboard": "Copy to clipboard",
     "Page path": "Page path",

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

@@ -70,6 +70,19 @@
     "feedback": "ご意見・ご要望"
   },
 
+  "create_page_dropdown": {
+    "new_page": "新規ページ作成",
+    "todays": {
+      "desc": "今日の◯◯を作成",
+      "memo": "メモ"
+    },
+    "template": {
+      "desc": "テンプレートページの作成/編集",
+      "children": "同一階層テンプレート",
+      "decendants": "下位層テンプレート"
+    }
+  },
+
   "copy_to_clipboard": {
     "Copy to clipboard": "クリップボードにコピー",
     "Page path": "ページ名",

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

@@ -71,6 +71,19 @@
     "feedback": "意见和要求"
   },
 
+  "create_page_dropdown": {
+    "new_page": "新页面",
+    "todays": {
+      "desc": "Create today's ...",
+      "memo": "memo"
+    },
+    "template": {
+      "desc": "创建/编辑模板页",
+      "children": "子模板",
+      "descendants": "子代模板"
+    }
+  },
+
 	"copy_to_clipboard": {
 		"Copy to clipboard": "复制到剪贴板",
 		"Page path": "页面路径",

apps/app/src/components/Sidebar/PageCreateButton.tsx

@@ -3,6 +3,7 @@ import React, { useCallback, useState } from 'react';
 import { pagePathUtils } from '@growi/core/dist/utils';
 import { format } from 'date-fns';
 import { useRouter } from 'next/router';
+import { useTranslation } from 'react-i18next';
 
 import { createPage } from '~/client/services/page-operation';
 import { toastError } from '~/client/util/toastr';
@@ -13,6 +14,7 @@ import loggerFactory from '~/utils/logger';
 const logger = loggerFactory('growi:cli:PageCreateButton');
 
 export const PageCreateButton = React.memo((): JSX.Element => {
+  const { t } = useTranslation('commons');
   const router = useRouter();
   const { data: currentPage, isLoading } = useSWRxCurrentPage();
   const { data: currentUser } = useCurrentUser();
@@ -165,8 +167,6 @@ export const PageCreateButton = React.memo((): JSX.Element => {
 
   // TODO: update button design
   // https://redmine.weseek.co.jp/issues/132683
-  // TODO: i18n
-  // https://redmine.weseek.co.jp/issues/132681
   return (
     <div
       className="d-flex flex-row"
@@ -200,11 +200,11 @@ export const PageCreateButton = React.memo((): JSX.Element => {
                 type="button"
                 disabled={isCreating}
               >
-                Create New Page
+                {t('create_page_dropdown.new_page')}
               </button>
             </li>
             <li><hr className="dropdown-divider" /></li>
-            <li><span className="text-muted px-3">Create today&apos;s ...</span></li>
+            <li><span className="text-muted px-3">{t('create_page_dropdown.todays.desc')}</span></li>
             {/* TODO: show correct create today's page path */}
             {/* https://redmine.weseek.co.jp/issues/133893 */}
             <li>
@@ -213,18 +213,18 @@ export const PageCreateButton = React.memo((): JSX.Element => {
                 onClick={onClickCreateTodaysButtonHandler}
                 type="button"
               >
-                Create today&apos;s
+                (TBD) Create today&apos;s
               </button>
             </li>
             <li><hr className="dropdown-divider" /></li>
-            <li><span className="text-muted px-3">Child page template</span></li>
+            <li><span className="text-muted text-nowrap px-3">{t('create_page_dropdown.template.desc')}</span></li>
             <li>
               <button
                 className="dropdown-item"
                 onClick={onClickTemplateForChildrenButtonHandler}
                 type="button"
               >
-                Template for children
+                {t('create_page_dropdown.template.children')}
               </button>
             </li>
             <li>
@@ -233,7 +233,7 @@ export const PageCreateButton = React.memo((): JSX.Element => {
                 onClick={onClickTemplateForDescendantsButtonHandler}
                 type="button"
               >
-                Template for descendants
+                {t('create_page_dropdown.template.decendants')}
               </button>
             </li>
           </ul>