Translate security/users component

.i18nrc.json

@@ -9,7 +9,8 @@
     "statusPage": "src/core_plugins/status_page",
     "tagCloud": "src/core_plugins/tagcloud",
     "xpack.idxMgmt": "x-pack/plugins/index_management",
-    "xpack.watcher": "x-pack/plugins/watcher"
+    "xpack.watcher": "x-pack/plugins/watcher",
+    "xpack.security": "x-pack/plugins/security"
   },
   "exclude": [
     "src/ui/ui_render/bootstrap/app_bootstrap.js",

x-pack/plugins/security/public/components/management/users/confirm_delete.js

@@ -7,52 +7,86 @@
 import React, { Component, Fragment } from 'react';
 import { EuiOverlayMask, EuiConfirmModal } from '@elastic/eui';
 import { toastNotifications } from 'ui/notify';
-export class ConfirmDelete extends Component {
+import { FormattedMessage, injectI18n } from '@kbn/i18n/react';
+
+export class ConfirmDeleteUI extends Component {
   deleteUsers = () => {
     const { usersToDelete, apiClient, callback } = this.props;
     const errors = [];
     usersToDelete.forEach(async username => {
       try {
         await apiClient.deleteUser(username);
-        toastNotifications.addSuccess(`Deleted user ${username}`);
+        toastNotifications.addSuccess(
+          this.props.intl.formatMessage({
+            id: "xpack.security.components.management.users.confirmDelete.userSuccessfullyDeletedNotificationMessage",
+            defaultMessage: "Deleted user {username}"
+          }, { username })
+        );
       } catch (e) {
         errors.push(username);
-        toastNotifications.addDanger(`Error deleting user ${username}`);
+        toastNotifications.addDanger(
+          this.props.intl.formatMessage({
+            id: "xpack.security.components.management.users.confirmDelete.userDeletingErrorNotificationMessage",
+            defaultMessage: "Error deleting user {username}"
+          }, { username })
+        );
       }
       if (callback) {
         callback(usersToDelete, errors);
       }
     });
   };
   render() {
-    const { usersToDelete, onCancel } = this.props;
+    const { usersToDelete, onCancel, intl } = this.props;
     const moreThanOne = usersToDelete.length > 1;
     const title = moreThanOne
-      ? `Delete ${usersToDelete.length} users`
-      : `Delete user '${usersToDelete[0]}'`;
+      ? intl.formatMessage({
+        id: "xpack.security.components.management.users.confirmDelete.deleteMultipleUsersTitle",
+        defaultMessage: "Delete {userLength} users"
+      }, { userLength: usersToDelete.length })
+      : intl.formatMessage({
+        id: "xpack.security.components.management.users.confirmDelete.deleteOneUserTitle",
+        defaultMessage: "Delete user {userLength}"
+      }, { userLength: usersToDelete[0] });
     return (
       <EuiOverlayMask>
         <EuiConfirmModal
           title={title}
           onCancel={onCancel}
           onConfirm={this.deleteUsers}
-          cancelButtonText="Cancel"
-          confirmButtonText="Delete"
+          cancelButtonText={intl.formatMessage({
+            id: "xpack.security.components.management.users.confirmDelete.cancelButtonLabel",
+            defaultMessage: "Cancel"
+          })}
+          confirmButtonText={intl.formatMessage({
+            id: "xpack.security.components.management.users.confirmDelete.confirmButtonLabel",
+            defaultMessage: "Delete"
+          })}
           buttonColor="danger"
         >
           <div>
             {moreThanOne ? (
               <Fragment>
                 <p>
-                  You are about to delete these users:
+                  <FormattedMessage
+                    id="xpack.security.components.management.users.confirmDelete.removingUsersDescription"
+                    defaultMessage="You are about to delete these users:"
+                  />
                 </p>
                 <ul>{usersToDelete.map(username => <li key={username}>{username}</li>)}</ul>
               </Fragment>
             ) : null}
-            <p>This operation cannot be undone.</p>
+            <p>
+              <FormattedMessage
+                id="xpack.security.components.management.users.confirmDelete.removingUsersWarningMessage"
+                defaultMessage="This operation cannot be undone."
+              />
+            </p>
           </div>
         </EuiConfirmModal>
       </EuiOverlayMask>
     );
   }
 }
+
+export const ConfirmDelete = injectI18n(ConfirmDeleteUI);