125487 apply i18n

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

@@ -866,7 +866,9 @@
     "plugin_card": "Plugin Card",
     "plugin_is_not_installed": "Plugin is not installed",
     "install": "Install",
-    "delete": "Delete"
+    "delete": "Delete",
+    "cancel": "Cancel",
+    "confirm": "Delete plugin?"
   },
   "cloud_setting_management": {
     "to_cloud_settings": "Open GROWI.cloud Settings"

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

@@ -874,7 +874,9 @@
     "plugin_card": "プラグインカード",
     "plugin_is_not_installed": "プラグインがインストールされていません",
     "install": "インストール",
-    "delete": "削除"
+    "delete": "削除",
+    "cancel": "中止",
+    "confirm": "プラグインを削除しますか？"
   },
   "cloud_setting_management": {
     "to_cloud_settings": "GROWI.cloud の管理画面へ"

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

@@ -874,7 +874,9 @@
     "plugin_card": "Plugin Card",
     "plugin_is_not_installed": "Plugin is not installed",
     "install": "Install",
-    "delete": "Delete"
+    "delete": "Delete",
+    "cancel": "Cancel",
+    "confirm": "Delete plugin?"
   },
   "cloud_setting_management": {
     "to_cloud_settings": "進入 GROWI.cloud 的管理界面"

apps/app/src/features/growi-plugin/client/components/Admin/PluginsExtensionPageContents/DeletePluginModal.tsx

@@ -1,5 +1,7 @@
 import React from 'react';
 
+import { useTranslation } from 'next-i18next';
+import Link from 'next/link';
 import {
   Button, Modal, ModalHeader, ModalBody, ModalFooter,
 } from 'reactstrap';
@@ -7,22 +9,26 @@ import {
 
 export type DeletePluginModalProps = {
   isShown: boolean,
+  name: string,
+  url: string,
   cancelToDelete: () => void,
   confirmToDelete: () => void,
 }
 
 export const DeletePluginModal = (props: DeletePluginModalProps): JSX.Element => {
   const {
-    isShown, cancelToDelete, confirmToDelete,
+    isShown, name, url, cancelToDelete, confirmToDelete,
   } = props;
 
+  const { t } = useTranslation('admin');
+
   const headerContent = () => {
     if (isShown === false) {
       return <></>;
     }
     return (
       <span>
-        Delete plugin?
+        {t('plugins.confirm')}
       </span>
     );
   };
@@ -33,9 +39,9 @@ export const DeletePluginModal = (props: DeletePluginModalProps): JSX.Element =>
     }
 
     return (
-      <>
-        <p className="card well mt-2 p-2">本当に削除しますか？</p>
-      </>
+      <div className="card well comment-body mt-2 p-2">
+        <Link href={`${url}`} legacyBehavior>{name}</Link>
+      </div>
     );
   };
 
@@ -45,9 +51,9 @@ export const DeletePluginModal = (props: DeletePluginModalProps): JSX.Element =>
     }
     return (
       <>
-        <Button onClick={cancelToDelete}>Cancel</Button>
+        <Button onClick={cancelToDelete}>{t('plugins.cancel')}</Button>
         <Button color="danger" onClick={confirmToDelete}>
-          Delete
+          {t('plugins.delete')}
         </Button>
       </>
     );

apps/app/src/features/growi-plugin/client/components/Admin/PluginsExtensionPageContents/PluginCard.tsx

@@ -110,6 +110,8 @@ export const PluginCard = (props: Props): JSX.Element => {
         {isDeleteConfirmModalShown && (
           <DeletePluginModal
             isShown={isDeleteConfirmModalShown}
+            name={name}
+            url={url}
             cancelToDelete={onCancelDeletePlugin}
             confirmToDelete={onDeletePlugin}
           />