diff --git a/x-pack/legacy/plugins/infra/public/components/source_configuration/log_columns_configuration_panel.tsx b/x-pack/legacy/plugins/infra/public/components/source_configuration/log_columns_configuration_panel.tsx
index bbc3cde41794c..53d426eba0449 100644
--- a/x-pack/legacy/plugins/infra/public/components/source_configuration/log_columns_configuration_panel.tsx
+++ b/x-pack/legacy/plugins/infra/public/components/source_configuration/log_columns_configuration_panel.tsx
@@ -19,7 +19,8 @@ import {
EuiDroppable,
EuiIcon,
} from '@elastic/eui';
-import { FormattedMessage, injectI18n } from '@kbn/i18n/react';
+import { i18n } from '@kbn/i18n';
+import { FormattedMessage } from '@kbn/i18n/react';
import React, { useCallback } from 'react';
import { DragHandleProps, DropResult } from '../../../../../common/eui_draggable';
@@ -167,29 +168,35 @@ const FieldLogColumnConfigurationPanel: React.FunctionComponent<{
remove,
},
dragHandleProps,
-}) => (
-
-
-
-
-
-
-
-
-
-
-
- {field}
-
-
-
-
-
-
-);
+}) => {
+ const fieldLogColumnTitle = i18n.translate(
+ 'xpack.infra.sourceConfiguration.fieldLogColumnTitle',
+ {
+ defaultMessage: 'Field',
+ }
+ );
+ return (
+
+
+
+
+
+
+
+ {fieldLogColumnTitle}
+
+ {field}
+
+
+
+
+
+
+ );
+};
const ExplainedLogColumnConfigurationPanel: React.FunctionComponent<{
fieldName: React.ReactNode;
@@ -213,23 +220,26 @@ const ExplainedLogColumnConfigurationPanel: React.FunctionComponent<{
-
+
);
-const RemoveLogColumnButton = injectI18n<{
+const RemoveLogColumnButton: React.FunctionComponent<{
onClick?: () => void;
-}>(({ intl, onClick }) => {
- const removeColumnLabel = intl.formatMessage({
- id: 'xpack.infra.sourceConfiguration.removeLogColumnButtonLabel',
- defaultMessage: 'Remove this column',
- });
+ columnDescription: string;
+}> = ({ onClick, columnDescription }) => {
+ const removeColumnLabel = i18n.translate(
+ 'xpack.infra.sourceConfiguration.removeLogColumnButtonLabel',
+ {
+ defaultMessage: 'Remove {columnDescription} column',
+ values: { columnDescription },
+ }
+ );
return (
);
-});
+};
const LogColumnConfigurationEmptyPrompt: React.FunctionComponent = () => (