Internationalization for actions

elastic · Jul 19, 2021 · d08c6eb · d08c6eb
1 parent cdd593a
commit d08c6eb
Show file tree

Hide file tree

Showing 2 changed files with 15 additions and 5 deletions.
diff --git a/x-pack/plugins/observability/public/pages/alerts/alerts_table_t_grid.tsx b/x-pack/plugins/observability/public/pages/alerts/alerts_table_t_grid.tsx
@@ -22,7 +22,6 @@ import type { TimelinesUIStart } from '../../../../timelines/public';
 import type { TopAlert } from './';
 import { useKibana } from '../../../../../../src/plugins/kibana_react/public';
 import type { ActionProps, ColumnHeaderOptions, RowRenderer } from '../../../../timelines/common';
-// import { EventsThContent } from '../../../../timelines/public';
 
 import { getRenderCellValue } from './render_cell_value';
 import { usePluginContext } from '../../hooks/use_plugin_context';
@@ -38,7 +37,6 @@ interface AlertsTableTGridProps {
   setRefetch: (ref: () => void) => void;
 }
 
-// TODO import EventsThContent from timelines plugin and customize a few css properties (position & padding-top)
 const EventsThContent = styled.div.attrs(({ className = '' }) => ({
   className: `siemEventsTable__thContent ${className}`,
 }))<{ textAlign?: string; width?: number }>`
@@ -126,7 +124,13 @@ export function AlertsTableTGrid(props: AlertsTableTGridProps) {
       id: 'expand',
       width: 40,
       headerCellRender: () => {
-        return <EventsThContent>Actions</EventsThContent>; // TODO: internationalization
+        return (
+          <EventsThContent>
+            {i18n.translate('xpack.observability.alertsTable.actionsTextLabel', {
+              defaultMessage: 'Actions',
+            })}
+          </EventsThContent>
+        );
       },
       rowCellRender: ({ data }: ActionProps) => {
         const dataFieldEs = data.reduce((acc, d) => ({ ...acc, [d.field]: d.value }), {});

diff --git a/x-pack/plugins/observability/public/pages/alerts/alerts_table_t_grid_actions.tsx b/x-pack/plugins/observability/public/pages/alerts/alerts_table_t_grid_actions.tsx
@@ -55,15 +55,21 @@ export function RowCellActionsRender({ data }: ActionProps) {
         anchorPosition="upCenter"
         button={
           <EuiButtonIcon
-            aria-label="show actions"
+            aria-label={i18n.translate('xpack.observability.alertsTable.actionsTextAriaLabel', {
+              defaultMessage: 'show actions',
+            })}
             iconType="boxesHorizontal"
             color="text"
             onClick={() => setIsPopoverOpen(!isPopoverOpen)}
           />
         }
         closePopover={() => setIsPopoverOpen(false)}
       >
-        <EuiPopoverTitle>Actions</EuiPopoverTitle>
+        <EuiPopoverTitle>
+          {i18n.translate('xpack.observability.alertsTable.actionsTextLabel', {
+            defaultMessage: 'Actions',
+          })}
+        </EuiPopoverTitle>
         <div style={{ width: 150 }}>
           <EuiButtonEmpty href={prepend(link ?? '')}>
             <EuiFlexGroup alignItems="center" component="span" gutterSize="s">