Create translation for aria-label in edit icon

elastic · Feb 19, 2020 · 4ed8b69 · 4ed8b69
1 parent c3aba93
commit 4ed8b69
Show file tree

Hide file tree

Showing 2 changed files with 7 additions and 1 deletion.
diff --git a/x-pack/legacy/plugins/siem/public/components/header_page/editable_title.tsx b/x-pack/legacy/plugins/siem/public/components/header_page/editable_title.tsx
@@ -85,7 +85,7 @@ const EditableTitleComponent: React.FC<Props> = ({ onSubmit, isLoading, title })
       </EuiFlexItem>
       <EuiFlexItem grow={false}>
         <StyledEuiButtonIcon
-          aria-label={title as string}
+          aria-label={i18n.EDIT_TITLE_ARIA(title as string)}
           iconType="pencil"
           onClick={onClickEditIcon}
           data-test-subj="editable-title-edit-icon"

diff --git a/x-pack/legacy/plugins/siem/public/components/header_page/translations.ts b/x-pack/legacy/plugins/siem/public/components/header_page/translations.ts
@@ -13,3 +13,9 @@ export const SUBMIT = i18n.translate('xpack.siem.header.editableTitle.submit', {
 export const CANCEL = i18n.translate('xpack.siem.header.editableTitle.cancel', {
   defaultMessage: 'Cancel',
 });
+
+export const EDIT_TITLE_ARIA = (title: string) =>
+  i18n.translate('xpack.siem.header.editableTitle.editButtonAria', {
+    values: { title },
+    defaultMessage: 'You can edit {title} by clicking',
+  });