github-mirrors/kibana
1
0
Fork 0
mirror of https://github.com/elastic/kibana.git synced 2025-04-24 09:48:58 -04:00
Code Issues Projects Releases Packages Wiki Activity

Issue 28875: Using i18n instead of injectI18n (#37845)

Browse source 
* Using i18n instead of injectI18n

* Update x-pack/plugins/monitoring/public/components/apm/instance/status.js

Co-Authored-By: Ahmad Bamieh <ahmadbamieh@gmail.com>

* Update x-pack/plugins/monitoring/public/components/table/table.js

Co-Authored-By: Maryia Lapata <mary.lopato@gmail.com>

* Addressed PR code review feedback
This commit is contained in:
igoristic 2019-06-07 16:01:56 -04:00 • committed by GitHub
parent 588f33392f
commit 01dccbfb75
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
51 changed files with 506 additions and 549 deletions
Download patch file Download diff file Expand all files Collapse all files

8
x-pack/plugins/monitoring/public/components/alerts/alerts.js
View file

@ -13,7 +13,6 @@ import { mapSeverity } from './map_severity';
import { FormattedAlert } from 'plugins/monitoring/components/alerts/formatted_alert';
import { EuiMonitoringTable } from 'plugins/monitoring/components/table';
import { EuiHealth, EuiIcon, EuiToolTip } from '@elastic/eui';
import { injectI18n } from '@kbn/i18n/react';
import { i18n } from '@kbn/i18n';
const linkToCategories = {
@ -130,7 +129,7 @@ const getColumns = (kbnUrl, scope) => ([
},
]);
const AlertsUI = ({ alerts, angular, sorting, pagination, onTableChange, intl }) => {
export const Alerts = ({ alerts, angular, sorting, pagination, onTableChange }) => {
const alertsFlattened = alerts.map(alert => ({
...alert,
status: alert.metadata.severity,
@ -154,8 +153,7 @@ const AlertsUI = ({ alerts, angular, sorting, pagination, onTableChange, intl })
search={{
box: {
incremental: true,
placeholder: intl.formatMessage({
id: 'xpack.monitoring.alerts.filterAlertsPlaceholder',
placeholder: i18n.translate('xpack.monitoring.alerts.filterAlertsPlaceholder', {
defaultMessage: 'Filter Alerts…'
})
@ -168,5 +166,3 @@ const AlertsUI = ({ alerts, angular, sorting, pagination, onTableChange, intl })
/>
);
};
export const Alerts = injectI18n(AlertsUI);

41
x-pack/plugins/monitoring/public/components/apm/instance/status.js
View file

@ -11,9 +11,10 @@ import { ApmStatusIcon } from '../status_icon';
import { formatMetric } from '../../../lib/format_number';
import { formatTimestampToDuration } from '../../../../common';
import { CALCULATE_DURATION_SINCE } from '../../../../common/constants';
import { FormattedMessage, injectI18n } from '@kbn/i18n/react';
import { FormattedMessage } from '@kbn/i18n/react';
import { i18n } from '@kbn/i18n';
function StatusUI({ stats, intl }) {
export function Status({ stats }) {
const {
name,
output,
@ -24,46 +25,42 @@ function StatusUI({ stats, intl }) {
const metrics = [
{
label: intl.formatMessage({
id: 'xpack.monitoring.apm.instance.status.nameLabel',
defaultMessage: 'Name',
label: i18n.translate('xpack.monitoring.apm.instance.status.nameLabel', {
defaultMessage: 'Name'
}),
value: name,
'data-test-subj': 'name'
},
{
label: intl.formatMessage({
id: 'xpack.monitoring.apm.instance.status.outputLabel',
defaultMessage: 'Output',
label: i18n.translate('xpack.monitoring.apm.instance.status.outputLabel', {
defaultMessage: 'Output'
}),
value: output,
'data-test-subj': 'output'
},
{
label: intl.formatMessage({
id: 'xpack.monitoring.apm.instance.status.versionLabel',
defaultMessage: 'Version',
label: i18n.translate('xpack.monitoring.apm.instance.status.versionLabel', {
defaultMessage: 'Version'
}),
value: version,
'data-test-subj': 'version'
},
{
label: intl.formatMessage({
id: 'xpack.monitoring.apm.instance.status.uptimeLabel',
defaultMessage: 'Uptime',
label: i18n.translate('xpack.monitoring.apm.instance.status.uptimeLabel', {
defaultMessage: 'Uptime'
}),
value: formatMetric(uptime, 'time_since'),
'data-test-subj': 'uptime'
},
{
label: intl.formatMessage({
id: 'xpack.monitoring.apm.instance.status.lastEventLabel',
defaultMessage: 'Last Event',
label: i18n.translate('xpack.monitoring.apm.instance.status.lastEventLabel', {
defaultMessage: 'Last Event'
}),
value: intl.formatMessage({
id: 'xpack.monitoring.apm.instance.status.lastEventDescription',
defaultMessage: '{timeOfLastEvent} ago' }, {
timeOfLastEvent: formatTimestampToDuration(+moment(timeOfLastEvent), CALCULATE_DURATION_SINCE)
value: i18n.translate('xpack.monitoring.apm.instance.status.lastEventDescription', {
defaultMessage: '{timeOfLastEvent} ago',
values: {
timeOfLastEvent: formatTimestampToDuration(+moment(timeOfLastEvent), CALCULATE_DURATION_SINCE)
}
}),
'data-test-subj': 'timeOfLastEvent',
}
@ -91,5 +88,3 @@ function StatusUI({ stats, intl }) {
/>
);
}
export const Status = injectI18n(StatusUI);

11
x-pack/plugins/monitoring/public/components/apm/instances/instances.js
View file

@ -13,7 +13,6 @@ import { Status } from './status';
import { formatMetric } from '../../../lib/format_number';
import { formatTimestampToDuration } from '../../../../common';
import { i18n } from '@kbn/i18n';
import { injectI18n } from '@kbn/i18n/react';
const columns = [
{
@ -84,7 +83,7 @@ const columns = [
},
];
export function ApmServerInstancesUI({ apms, intl }) {
export function ApmServerInstances({ apms }) {
const {
pagination,
sorting,
@ -111,8 +110,7 @@ export function ApmServerInstancesUI({ apms, intl }) {
search={{
box: {
incremental: true,
placeholder: intl.formatMessage({
id: 'xpack.monitoring.apm.instances.filterInstancesPlaceholder',
placeholder: i18n.translate('xpack.monitoring.apm.instances.filterInstancesPlaceholder', {
defaultMessage: 'Filter Instances…'
})
},
@ -120,8 +118,7 @@ export function ApmServerInstancesUI({ apms, intl }) {
{
type: 'field_value_selection',
field: 'version',
name: intl.formatMessage({
id: 'xpack.monitoring.apm.instances.versionFilter',
name: i18n.translate('xpack.monitoring.apm.instances.versionFilter', {
defaultMessage: 'Version'
}),
options: versions,
@ -139,5 +136,3 @@ export function ApmServerInstancesUI({ apms, intl }) {
</EuiPage>
);
}
export const ApmServerInstances = injectI18n(ApmServerInstancesUI);

31
x-pack/plugins/monitoring/public/components/apm/instances/status.js
View file

@ -11,9 +11,10 @@ import { ApmStatusIcon } from '../status_icon';
import { formatMetric } from '../../../lib/format_number';
import { formatTimestampToDuration } from '../../../../common';
import { CALCULATE_DURATION_SINCE } from '../../../../common/constants';
import { FormattedMessage, injectI18n } from '@kbn/i18n/react';
import { FormattedMessage } from '@kbn/i18n/react';
import { i18n } from '@kbn/i18n';
function StatusUI({ stats, intl }) {
export function Status({ stats }) {
const {
apms: {
total
@ -24,30 +25,28 @@ function StatusUI({ stats, intl }) {
const metrics = [
{
label: intl.formatMessage({
id: 'xpack.monitoring.apm.instances.status.serversLabel',
defaultMessage: 'Servers',
label: i18n.translate('xpack.monitoring.apm.instances.status.serversLabel', {
defaultMessage: 'Servers'
}),
value: total,
'data-test-subj': 'total'
},
{
label: intl.formatMessage({
id: 'xpack.monitoring.apm.instances.status.totalEventsLabel',
defaultMessage: 'Total Events',
label: i18n.translate('xpack.monitoring.apm.instances.status.totalEventsLabel', {
defaultMessage: 'Total Events'
}),
value: formatMetric(totalEvents, '0.[0]a'),
'data-test-subj': 'totalEvents'
},
{
label: intl.formatMessage({
id: 'xpack.monitoring.apm.instances.status.lastEventLabel',
defaultMessage: 'Last Event',
label: i18n.translate('xpack.monitoring.apm.instances.status.lastEventLabel', {
defaultMessage: 'Last Event'
}),
value: intl.formatMessage({
id: 'xpack.monitoring.apm.instances.status.lastEventDescription',
defaultMessage: '{timeOfLastEvent} ago' }, {
timeOfLastEvent: formatTimestampToDuration(+moment(timeOfLastEvent), CALCULATE_DURATION_SINCE)
value: i18n.translate('xpack.monitoring.apm.instances.status.lastEventDescription', {
defaultMessage: '{timeOfLastEvent} ago',
values: {
timeOfLastEvent: formatTimestampToDuration(+moment(timeOfLastEvent), CALCULATE_DURATION_SINCE)
}
}),
'data-test-subj': 'timeOfLastEvent',
}
@ -75,5 +74,3 @@ function StatusUI({ stats, intl }) {
/>
);
}
export const Status = injectI18n(StatusUI);

15
x-pack/plugins/monitoring/public/components/apm/status_icon.js
View file

@ -6,9 +6,9 @@
import React from 'react';
import { StatusIcon } from 'plugins/monitoring/components/status_icon';
import { injectI18n } from '@kbn/i18n/react';
import { i18n } from '@kbn/i18n';
function ApmStatusIconUI({ status, availability = true, intl }) {
export function ApmStatusIcon({ status, availability = true }) {
const type = (() => {
if (!availability) {
return StatusIcon.TYPES.GRAY;
@ -21,13 +21,12 @@ function ApmStatusIconUI({ status, availability = true, intl }) {
return (
<StatusIcon
type={type}
label={intl.formatMessage({
id: 'xpack.monitoring.apm.healthStatusLabel',
defaultMessage: 'Health: {status}' }, {
status
label={i18n.translate('xpack.monitoring.apm.healthStatusLabel', {
defaultMessage: 'Health: {status}',
values: {
status
}
})}
/>
);
}
export const ApmStatusIcon = injectI18n(ApmStatusIconUI);

58
x-pack/plugins/monitoring/public/components/beats/beat/beat.js
View file

@ -8,10 +8,10 @@ import React from 'react';
import { MonitoringTimeseriesContainer } from '../../chart';
import { formatMetric } from '../../../lib/format_number';
import { EuiFlexItem, EuiPage, EuiPageBody, EuiFlexGrid, EuiSpacer, EuiPageContent, EuiPanel } from '@elastic/eui';
import { injectI18n } from '@kbn/i18n/react';
import { i18n } from '@kbn/i18n';
import { SummaryStatus } from '../../summary_status';
function BeatUi({ summary, metrics, intl, ...props }) {
export function Beat({ summary, metrics, ...props }) {
const metricsToShow = [
metrics.beat_event_rates,
@ -26,37 +26,51 @@ function BeatUi({ summary, metrics, intl, ...props }) {
const summarytStatsTop = [
{
label: intl.formatMessage({ id: 'xpack.monitoring.beats.instance.nameLabel', defaultMessage: 'Name' }),
label: i18n.translate('xpack.monitoring.beats.instance.nameLabel', {
defaultMessage: 'Name'
}),
value: summary.name,
'data-test-subj': 'name'
},
{
label: intl.formatMessage({ id: 'xpack.monitoring.beats.instance.hostLabel', defaultMessage: 'Host' }),
label: i18n.translate('xpack.monitoring.beats.instance.hostLabel', {
defaultMessage: 'Host'
}),
value: summary.transportAddress,
'data-test-subj': 'host'
},
{
label: intl.formatMessage({ id: 'xpack.monitoring.beats.instance.versionLabel', defaultMessage: 'Version' }),
label: i18n.translate('xpack.monitoring.beats.instance.versionLabel', {
defaultMessage: 'Version'
}),
value: summary.version,
'data-test-subj': 'version'
},
{
label: intl.formatMessage({ id: 'xpack.monitoring.beats.instance.typeLabel', defaultMessage: 'Type' }),
label: i18n.translate('xpack.monitoring.beats.instance.typeLabel', {
defaultMessage: 'Type'
}),
value: summary.type,
'data-test-subj': 'type'
},
{
label: intl.formatMessage({ id: 'xpack.monitoring.beats.instance.outputLabel', defaultMessage: 'Output' }),
label: i18n.translate('xpack.monitoring.beats.instance.outputLabel', {
defaultMessage: 'Output'
}),
value: summary.output,
'data-test-subj': 'output'
},
{
label: intl.formatMessage({ id: 'xpack.monitoring.beats.instance.configReloadsLabel', defaultMessage: 'Config reloads' }),
label: i18n.translate('xpack.monitoring.beats.instance.configReloadsLabel', {
defaultMessage: 'Config reloads'
}),
value: formatMetric(summary.configReloads, 'int_commas'),
'data-test-subj': 'configReloads'
},
{
label: intl.formatMessage({ id: 'xpack.monitoring.beats.instance.uptimeLabel', defaultMessage: 'Uptime' }),
label: i18n.translate('xpack.monitoring.beats.instance.uptimeLabel', {
defaultMessage: 'Uptime'
}),
value: formatMetric(summary.uptime, 'time_since'),
'data-test-subj': 'uptime'
},
@ -64,32 +78,44 @@ function BeatUi({ summary, metrics, intl, ...props }) {
const summarytStatsBot = [
{
label: intl.formatMessage({ id: 'xpack.monitoring.beats.instance.eventsTotalLabel', defaultMessage: 'Events total' }),
label: i18n.translate('xpack.monitoring.beats.instance.eventsTotalLabel', {
defaultMessage: 'Events total'
}),
value: formatMetric(summary.eventsTotal, 'int_commas'),
'data-test-subj': 'eventsTotal'
},
{
label: intl.formatMessage({ id: 'xpack.monitoring.beats.instance.eventsEmittedLabel', defaultMessage: 'Events emitted' }),
label: i18n.translate('xpack.monitoring.beats.instance.eventsEmittedLabel', {
defaultMessage: 'Events emitted'
}),
value: formatMetric(summary.eventsEmitted, 'int_commas'),
'data-test-subj': 'eventsEmitted'
},
{
label: intl.formatMessage({ id: 'xpack.monitoring.beats.instance.eventsDroppedLabel', defaultMessage: 'Events dropped' }),
label: i18n.translate('xpack.monitoring.beats.instance.eventsDroppedLabel', {
defaultMessage: 'Events dropped'
}),
value: formatMetric(summary.eventsDropped, 'int_commas'),
'data-test-subj': 'eventsDropped'
},
{
label: intl.formatMessage({ id: 'xpack.monitoring.beats.instance.bytesSentLabel', defaultMessage: 'Bytes sent' }),
label: i18n.translate('xpack.monitoring.beats.instance.bytesSentLabel', {
defaultMessage: 'Bytes sent'
}),
value: formatMetric(summary.bytesWritten, 'byte'),
'data-test-subj': 'bytesWritten'
},
{
label: intl.formatMessage({ id: 'xpack.monitoring.beats.instance.handlesLimitSoftLabel', defaultMessage: 'Handles limit (soft)' }),
label: i18n.translate('xpack.monitoring.beats.instance.handlesLimitSoftLabel', {
defaultMessage: 'Handles limit (soft)'
}),
value: formatMetric(summary.handlesSoftLimit, 'byte'),
'data-test-subj': 'handlesLimitSoft'
},
{
label: intl.formatMessage({ id: 'xpack.monitoring.beats.instance.handlesLimitHardLabel', defaultMessage: 'Handles limit (hard)' }),
label: i18n.translate('xpack.monitoring.beats.instance.handlesLimitHardLabel', {
defaultMessage: 'Handles limit (hard)'
}),
value: formatMetric(summary.handlesHardLimit, 'byte'),
'data-test-subj': 'handlesLimitHard'
},
@ -126,5 +152,3 @@ function BeatUi({ summary, metrics, intl, ...props }) {
</EuiPage>
);
}
export const Beat = injectI18n(BeatUi);

5
x-pack/plugins/monitoring/public/components/beats/listing/listing.js
View file

@ -11,9 +11,8 @@ import { Stats } from 'plugins/monitoring/components/beats';
import { formatMetric } from 'plugins/monitoring/lib/format_number';
import { EuiMonitoringTable } from 'plugins/monitoring/components/table';
import { i18n } from '@kbn/i18n';
import { injectI18n } from '@kbn/i18n/react';
class ListingUI extends PureComponent {
export class Listing extends PureComponent {
getColumns() {
const { kbnUrl, scope } = this.props.angular;
@ -136,5 +135,3 @@ class ListingUI extends PureComponent {
);
}
}
export const Listing = injectI18n(ListingUI);

18
x-pack/plugins/monitoring/public/components/beats/overview/__snapshots__/overview.test.js.snap generated
View file

@ -36,7 +36,7 @@ exports[`Overview that overview page renders normally 1`] = `
<EuiSpacer
size="s"
/>
<InjectIntl(LatestActiveUi)
<LatestActive
latestActive={
Array [
Object {
@ -160,7 +160,7 @@ exports[`Overview that overview page renders normally 1`] = `
hasShadow={false}
paddingSize="m"
>
<InjectIntl(MonitoringTimeseriesContainerUI)
<MonitoringTimeseriesContainer
series={1}
/>
</EuiPanel>
@ -178,7 +178,7 @@ exports[`Overview that overview page renders normally 1`] = `
hasShadow={false}
paddingSize="m"
>
<InjectIntl(MonitoringTimeseriesContainerUI)
<MonitoringTimeseriesContainer
series={1}
/>
</EuiPanel>
@ -196,7 +196,7 @@ exports[`Overview that overview page renders normally 1`] = `
hasShadow={false}
paddingSize="m"
>
<InjectIntl(MonitoringTimeseriesContainerUI)
<MonitoringTimeseriesContainer
series={1}
/>
</EuiPanel>
@ -214,7 +214,7 @@ exports[`Overview that overview page renders normally 1`] = `
hasShadow={false}
paddingSize="m"
>
<InjectIntl(MonitoringTimeseriesContainerUI)
<MonitoringTimeseriesContainer
series={1}
/>
</EuiPanel>
@ -264,7 +264,7 @@ exports[`Overview that overview page shows a message if there is no beats data 1
hasShadow={false}
paddingSize="m"
>
<InjectIntl(MonitoringTimeseriesContainerUI)
<MonitoringTimeseriesContainer
series={1}
/>
</EuiPanel>
@ -282,7 +282,7 @@ exports[`Overview that overview page shows a message if there is no beats data 1
hasShadow={false}
paddingSize="m"
>
<InjectIntl(MonitoringTimeseriesContainerUI)
<MonitoringTimeseriesContainer
series={1}
/>
</EuiPanel>
@ -300,7 +300,7 @@ exports[`Overview that overview page shows a message if there is no beats data 1
hasShadow={false}
paddingSize="m"
>
<InjectIntl(MonitoringTimeseriesContainerUI)
<MonitoringTimeseriesContainer
series={1}
/>
</EuiPanel>
@ -318,7 +318,7 @@ exports[`Overview that overview page shows a message if there is no beats data 1
hasShadow={false}
paddingSize="m"
>
<InjectIntl(MonitoringTimeseriesContainerUI)
<MonitoringTimeseriesContainer
series={1}
/>
</EuiPanel>

28
x-pack/plugins/monitoring/public/components/beats/overview/latest_active.js
View file

@ -9,18 +9,28 @@ import PropTypes from 'prop-types';
import {
EuiBasicTable
} from '@elastic/eui';
import { injectI18n } from '@kbn/i18n/react';
import { i18n } from '@kbn/i18n';
function LatestActiveUi({ latestActive, intl }) {
export function LatestActive({ latestActive }) {
const rangeMap = {
'last1m':
intl.formatMessage({ id: 'xpack.monitoring.beats.overview.latestActive.last1MinuteLabel', defaultMessage: 'Last 1 minute' }),
i18n.translate('xpack.monitoring.beats.overview.latestActive.last1MinuteLabel', {
defaultMessage: 'Last 1 minute'
}),
'last5m':
intl.formatMessage({ id: 'xpack.monitoring.beats.overview.latestActive.last5MinutesLabel', defaultMessage: 'Last 5 minutes' }),
i18n.translate('xpack.monitoring.beats.overview.latestActive.last5MinutesLabel', {
defaultMessage: 'Last 5 minutes'
}),
'last20m':
intl.formatMessage({ id: 'xpack.monitoring.beats.overview.latestActive.last20MinutesLabel', defaultMessage: 'Last 20 minutes' }),
'last1h': intl.formatMessage({ id: 'xpack.monitoring.beats.overview.latestActive.last1HourLabel', defaultMessage: 'Last 1 hour' }),
'last1d': intl.formatMessage({ id: 'xpack.monitoring.beats.overview.latestActive.last1DayLabel', defaultMessage: 'Last 1 day' }),
i18n.translate('xpack.monitoring.beats.overview.latestActive.last20MinutesLabel', {
defaultMessage: 'Last 20 minutes'
}),
'last1h': i18n.translate('xpack.monitoring.beats.overview.latestActive.last1HourLabel', {
defaultMessage: 'Last 1 hour'
}),
'last1d': i18n.translate('xpack.monitoring.beats.overview.latestActive.last1DayLabel', {
defaultMessage: 'Last 1 day'
}),
};
const activity = latestActive.map(({ range, count }) => ({
@ -46,11 +56,9 @@ function LatestActiveUi({ latestActive, intl }) {
);
}
LatestActiveUi.propTypes = {
LatestActive.propTypes = {
latestActive: PropTypes.arrayOf(PropTypes.shape({
range: PropTypes.string.isRequired,
count: PropTypes.number.isRequired,
})).isRequired
};
export const LatestActive = injectI18n(LatestActiveUi);

6
x-pack/plugins/monitoring/public/components/beats/overview/latest_active.test.js
View file

@ -5,7 +5,7 @@
*/
import React from 'react';
import { shallowWithIntl } from '../../../../../../test_utils/enzyme_helpers';
import { shallow } from 'enzyme';
import { LatestActive } from './latest_active';
@ -19,8 +19,8 @@ describe('Latest Active', () => {
{ range: 'last1d', count: 10 },
];
const component = shallowWithIntl(
<LatestActive.WrappedComponent
const component = shallow(
<LatestActive
latestActive={latestActive}
/>
);

19
x-pack/plugins/monitoring/public/components/beats/overview/overview.js
View file

@ -21,9 +21,10 @@ import {
EuiPanel,
EuiPageContent
} from '@elastic/eui';
import { FormattedMessage, injectI18n } from '@kbn/i18n/react';
import { FormattedMessage } from '@kbn/i18n/react';
import { i18n } from '@kbn/i18n';
function renderLatestActive(latestActive, latestTypes, latestVersions, intl) {
function renderLatestActive(latestActive, latestTypes, latestVersions) {
if (latestTypes && latestTypes.length > 0) {
return (
<EuiFlexGroup wrap>
@ -73,10 +74,9 @@ function renderLatestActive(latestActive, latestTypes, latestVersions, intl) {
);
}
const calloutMsg = intl.formatMessage({
id: 'xpack.monitoring.beats.overview.noActivityDescription',
// eslint-disable-next-line max-len
defaultMessage: `Hi there! This area is where your latest Beats activity would show up, but you don't seem to have any activity within the last day.`
const calloutMsg = i18n.translate('xpack.monitoring.beats.overview.noActivityDescription', {
defaultMessage: 'Hi there! This area is where your latest Beats activity would show up, ' +
`but you don't seem to have any activity within the last day.`
});
@ -89,13 +89,12 @@ function renderLatestActive(latestActive, latestTypes, latestVersions, intl) {
);
}
export function BeatsOverviewUI({
export function BeatsOverview({
latestActive,
latestTypes,
latestVersions,
stats,
metrics,
intl,
...props
}) {
const seriesToShow = [
@ -121,7 +120,7 @@ export function BeatsOverviewUI({
<EuiPageBody>
<EuiPageContent>
<Stats stats={stats} />
{renderLatestActive(latestActive, latestTypes, latestVersions, intl)}
{renderLatestActive(latestActive, latestTypes, latestVersions)}
<EuiSpacer size="s"/>
<EuiFlexGroup wrap>
{charts}
@ -131,5 +130,3 @@ export function BeatsOverviewUI({
</EuiPage>
);
}
export const BeatsOverview = injectI18n(BeatsOverviewUI);

10
x-pack/plugins/monitoring/public/components/beats/overview/overview.test.js
View file

@ -5,7 +5,7 @@
*/
import React from 'react';
import { shallowWithIntl } from '../../../../../../test_utils/enzyme_helpers';
import { shallow } from 'enzyme';
jest.mock('../stats', () => ({
Stats: () => 'Stats',
@ -41,8 +41,8 @@ describe('Overview', () => {
beat_output_errors: 1
};
const component = shallowWithIntl(
<BeatsOverview.WrappedComponent
const component = shallow(
<BeatsOverview
latestActive={latestActive}
latestTypes={latestTypes}
latestVersions={latestVersions}
@ -62,8 +62,8 @@ describe('Overview', () => {
beat_output_errors: 1
};
const component = shallowWithIntl(
<BeatsOverview.WrappedComponent
const component = shallow(
<BeatsOverview
stats={[]}
metrics={metrics}
/>

11
x-pack/plugins/monitoring/public/components/chart/horizontal_legend.js
View file

@ -9,9 +9,10 @@ import { includes, isFunction } from 'lodash';
import {
EuiKeyboardAccessible,
} from '@elastic/eui';
import { FormattedMessage, injectI18n } from '@kbn/i18n/react';
import { FormattedMessage } from '@kbn/i18n/react';
import { i18n } from '@kbn/i18n';
class HorizontalLegendUI extends React.Component {
export class HorizontalLegend extends React.Component {
constructor() {
super();
this.formatter = this.formatter.bind(this);
@ -60,7 +61,6 @@ class HorizontalLegendUI extends React.Component {
}
createSeries(row, rowIdx) {
const { intl } = this.props;
const classes = ['col-md-4 col-xs-6 monRhythmChart__legendItem'];
if (!includes(this.props.seriesFilter, row.id)) {
@ -85,8 +85,7 @@ class HorizontalLegendUI extends React.Component {
<span
className="fa fa-circle monRhythmChart__legendIndicator"
style={{ color: row.color }}
aria-label={intl.formatMessage({
id: 'xpack.monitoring.chart.horizontalLegend.toggleButtonAriaLabel',
aria-label={i18n.translate('xpack.monitoring.chart.horizontalLegend.toggleButtonAriaLabel', {
defaultMessage: 'toggle button'
})}
/>
@ -110,5 +109,3 @@ class HorizontalLegendUI extends React.Component {
);
}
}
export const HorizontalLegend = injectI18n(HorizontalLegendUI);

17
x-pack/plugins/monitoring/public/components/chart/monitoring_timeseries_container.js
View file

@ -14,9 +14,10 @@ import { InfoTooltip } from './info_tooltip';
import {
EuiIconTip, EuiFlexGroup, EuiFlexItem, EuiTitle, EuiScreenReaderOnly
} from '@elastic/eui';
import { FormattedMessage, injectI18n } from '@kbn/i18n/react';
import { FormattedMessage } from '@kbn/i18n/react';
import { i18n } from '@kbn/i18n';
function MonitoringTimeseriesContainerUI({ series, onBrush, intl }) {
export function MonitoringTimeseriesContainer({ series, onBrush }) {
if (series === undefined) {
return null; // still loading
}
@ -27,10 +28,11 @@ function MonitoringTimeseriesContainerUI({ series, onBrush, intl }) {
const bucketSize = get(first(series), 'bucket_size'); // bucket size will be the same for all metrics in all series
const seriesScreenReaderTextList = [
intl.formatMessage({
id: 'xpack.monitoring.chart.seriesScreenReaderListDescription',
defaultMessage: 'Interval: {bucketSize}' }, {
bucketSize
i18n.translate('xpack.monitoring.chart.seriesScreenReaderListDescription', {
defaultMessage: 'Interval: {bucketSize}',
values: {
bucketSize
}
})
]
.concat(series.map(item => `${item.metric.label}: ${item.metric.description}`));
@ -80,6 +82,3 @@ function MonitoringTimeseriesContainerUI({ series, onBrush, intl }) {
</EuiFlexGroup>
);
}
export const MonitoringTimeseriesContainer = injectI18n(MonitoringTimeseriesContainerUI);

34
x-pack/plugins/monitoring/public/components/cluster/listing/alerts_indicator.js
View file

@ -7,13 +7,14 @@
import React from 'react';
import { mapSeverity } from 'plugins/monitoring/components/alerts/map_severity';
import { EuiHealth, EuiToolTip } from '@elastic/eui';
import { FormattedMessage, injectI18n } from '@kbn/i18n/react';
import { FormattedMessage } from '@kbn/i18n/react';
import { i18n } from '@kbn/i18n';
const HIGH_SEVERITY = 2000;
const MEDIUM_SEVERITY = 1000;
const LOW_SEVERITY = 0;
function AlertsIndicatorUi({ alerts, intl }) {
export function AlertsIndicator({ alerts }) {
if (alerts && alerts.count > 0) {
const severity = (() => {
if (alerts.high > 0) { return HIGH_SEVERITY; }
@ -24,18 +25,21 @@ function AlertsIndicatorUi({ alerts, intl }) {
const tooltipText = (() => {
switch (severity) {
case HIGH_SEVERITY:
return intl.formatMessage({
id: 'xpack.monitoring.cluster.listing.alertsInticator.highSeverityTooltip',
defaultMessage: 'There are some critical cluster issues that require your immediate attention!' });
return i18n.translate('xpack.monitoring.cluster.listing.alertsInticator.highSeverityTooltip', {
defaultMessage: 'There are some critical cluster issues that require your immediate attention!'
});
case MEDIUM_SEVERITY:
return intl.formatMessage({
id: 'xpack.monitoring.cluster.listing.alertsInticator.mediumSeverityTooltip',
defaultMessage: 'There are some issues that might have impact on your cluster.' });
return i18n.translate(
'xpack.monitoring.cluster.listing.alertsInticator.mediumSeverityTooltip',
{
defaultMessage: 'There are some issues that might have impact on your cluster.'
}
);
default:
// might never show
return intl.formatMessage({
id: 'xpack.monitoring.cluster.listing.alertsInticator.lowSeverityTooltip',
defaultMessage: 'There are some low-severity cluster issues' });
return i18n.translate('xpack.monitoring.cluster.listing.alertsInticator.lowSeverityTooltip', {
defaultMessage: 'There are some low-severity cluster issues'
});
}
})();
@ -53,9 +57,9 @@ function AlertsIndicatorUi({ alerts, intl }) {
return (
<EuiToolTip
content={intl.formatMessage({
id: 'xpack.monitoring.cluster.listing.alertsInticator.clearStatusTooltip',
defaultMessage: 'Cluster status is clear!' })}
content={i18n.translate('xpack.monitoring.cluster.listing.alertsInticator.clearStatusTooltip', {
defaultMessage: 'Cluster status is clear!'
})}
position="bottom"
>
<EuiHealth color="success" data-test-subj="alertIcon">
@ -67,5 +71,3 @@ function AlertsIndicatorUi({ alerts, intl }) {
</EuiToolTip>
);
}
export const AlertsIndicator = injectI18n(AlertsIndicatorUi);

16
x-pack/plugins/monitoring/public/components/cluster/overview/alerts_panel.js
View file

@ -10,7 +10,8 @@ import { mapSeverity } from 'plugins/monitoring/components/alerts/map_severity';
import { formatTimestampToDuration } from '../../../../common/format_timestamp_to_duration';
import { CALCULATE_DURATION_SINCE } from '../../../../common/constants';
import { formatDateTimeLocal } from '../../../../common/formatting';
import { FormattedMessage, injectI18n } from '@kbn/i18n/react';
import { FormattedMessage } from '@kbn/i18n/react';
import { i18n } from '@kbn/i18n';
import {
EuiFlexGroup,
@ -22,7 +23,7 @@ import {
EuiCallOut,
} from '@elastic/eui';
function AlertsPanelUi({ alerts, changeUrl, intl }) {
export function AlertsPanel({ alerts, changeUrl }) {
const goToAlerts = () => changeUrl('/alerts');
if (!alerts || !alerts.length) {
@ -35,10 +36,11 @@ function AlertsPanelUi({ alerts, changeUrl, intl }) {
const severityIcon = mapSeverity(item.metadata.severity);
if (item.resolved_timestamp) {
severityIcon.title = intl.formatMessage({
id: 'xpack.monitoring.cluster.overview.alertsPanel.severityIconTitle',
defaultMessage: '{severityIconTitle} (resolved {time} ago)' },
{ severityIconTitle: severityIcon.title, time: formatTimestampToDuration(item.resolved_timestamp, CALCULATE_DURATION_SINCE)
severityIcon.title = i18n.translate('xpack.monitoring.cluster.overview.alertsPanel.severityIconTitle', {
defaultMessage: '{severityIconTitle} (resolved {time} ago)',
values: {
severityIconTitle: severityIcon.title, time: formatTimestampToDuration(item.resolved_timestamp, CALCULATE_DURATION_SINCE)
}
});
severityIcon.color = 'success';
severityIcon.iconType = 'check';
@ -106,5 +108,3 @@ function AlertsPanelUi({ alerts, changeUrl, intl }) {
</div>
);
}
export const AlertsPanel = injectI18n(AlertsPanelUi);

27
x-pack/plugins/monitoring/public/components/cluster/overview/apm_panel.js
View file

@ -9,7 +9,8 @@ import moment from 'moment';
import { get } from 'lodash';
import { formatMetric } from 'plugins/monitoring/lib/format_number';
import { ClusterItemContainer, BytesPercentageUsage } from './helpers';
import { FormattedMessage, injectI18n } from '@kbn/i18n/react';
import { FormattedMessage } from '@kbn/i18n/react';
import { i18n } from '@kbn/i18n';
import {
EuiFlexGrid,
@ -25,7 +26,7 @@ import {
import { formatTimestampToDuration } from '../../../../common';
import { CALCULATE_DURATION_SINCE } from '../../../../common/constants';
function ApmPanelUi(props) {
export function ApmPanel(props) {
if (!get(props, 'apms.total', 0) > 0) {
return null;
}
@ -37,7 +38,9 @@ function ApmPanelUi(props) {
<ClusterItemContainer
{...props}
url="apm"
title={props.intl.formatMessage({ id: 'xpack.monitoring.cluster.overview.apmPanel.apmTitle', defaultMessage: 'APM' })}
title={i18n.translate('xpack.monitoring.cluster.overview.apmPanel.apmTitle', {
defaultMessage: 'APM'
})}
>
<EuiFlexGrid columns={4}>
<EuiFlexItem>
@ -46,8 +49,9 @@ function ApmPanelUi(props) {
<h3>
<EuiLink
onClick={goToApm}
aria-label={props.intl.formatMessage({
id: 'xpack.monitoring.cluster.overview.apmPanel.overviewLinkAriaLabel', defaultMessage: 'APM Overview' })}
aria-label={i18n.translate('xpack.monitoring.cluster.overview.apmPanel.overviewLinkAriaLabel', {
defaultMessage: 'APM Overview'
})}
data-test-subj="apmOverview"
>
<FormattedMessage
@ -90,10 +94,13 @@ function ApmPanelUi(props) {
<h3>
<EuiLink
onClick={goToInstances}
aria-label={props.intl.formatMessage({
id: 'xpack.monitoring.cluster.overview.apmPanel.instancesTotalLinkAriaLabel',
defaultMessage: 'Apm Instances: {apmsTotal}' },
{ apmsTotal: props.apms.total })}
aria-label={i18n.translate(
'xpack.monitoring.cluster.overview.apmPanel.instancesTotalLinkAriaLabel',
{
defaultMessage: 'Apm Instances: {apmsTotal}',
values: { apmsTotal: props.apms.total }
}
)}
data-test-subj="apmListing"
>
<FormattedMessage
@ -122,5 +129,3 @@ function ApmPanelUi(props) {
</ClusterItemContainer>
);
}
export const ApmPanel = injectI18n(ApmPanelUi);

27
x-pack/plugins/monitoring/public/components/cluster/overview/beats_panel.js
View file

@ -19,9 +19,10 @@ import {
EuiHorizontalRule,
} from '@elastic/eui';
import { ClusterItemContainer } from './helpers';
import { FormattedMessage, injectI18n } from '@kbn/i18n/react';
import { FormattedMessage } from '@kbn/i18n/react';
import { i18n } from '@kbn/i18n';
function BeatsPanelUi(props) {
export function BeatsPanel(props) {
if (!get(props, 'beats.total', 0) > 0) {
return null;
}
@ -50,7 +51,9 @@ function BeatsPanelUi(props) {
<ClusterItemContainer
{...props}
url="beats"
title={props.intl.formatMessage({ id: 'xpack.monitoring.cluster.overview.beatsPanel.beatsTitle', defaultMessage: 'Beats' })}
title={i18n.translate('xpack.monitoring.cluster.overview.beatsPanel.beatsTitle', {
defaultMessage: 'Beats'
})}
>
<EuiFlexGrid columns={4}>
<EuiFlexItem>
@ -59,8 +62,9 @@ function BeatsPanelUi(props) {
<h3>
<EuiLink
onClick={goToBeats}
aria-label={props.intl.formatMessage({
id: 'xpack.monitoring.cluster.overview.beatsPanel.overviewLinkAriaLabel', defaultMessage: 'Beats Overview' })}
aria-label={i18n.translate('xpack.monitoring.cluster.overview.beatsPanel.overviewLinkAriaLabel', {
defaultMessage: 'Beats Overview'
})}
data-test-subj="beatsOverview"
>
<FormattedMessage
@ -99,10 +103,13 @@ function BeatsPanelUi(props) {
<h3>
<EuiLink
onClick={goToInstances}
aria-label={props.intl.formatMessage({
id: 'xpack.monitoring.cluster.overview.beatsPanel.instancesTotalLinkAriaLabel',
defaultMessage: 'Beats Instances: {beatsTotal}' },
{ beatsTotal: props.beats.total })}
aria-label={i18n.translate(
'xpack.monitoring.cluster.overview.beatsPanel.instancesTotalLinkAriaLabel',
{
defaultMessage: 'Beats Instances: {beatsTotal}',
values: { beatsTotal: props.beats.total }
}
)}
data-test-subj="beatsListing"
>
<FormattedMessage
@ -123,5 +130,3 @@ function BeatsPanelUi(props) {
</ClusterItemContainer>
);
}
export const BeatsPanel = injectI18n(BeatsPanelUi);

32
x-pack/plugins/monitoring/public/components/cluster/overview/elasticsearch_panel.js
View file

@ -24,7 +24,7 @@ import {
} from '@elastic/eui';
import { LicenseText } from './license_text';
import { i18n } from '@kbn/i18n';
import { FormattedMessage, injectI18n } from '@kbn/i18n/react';
import { FormattedMessage } from '@kbn/i18n/react';
import { Reason } from '../../logs/reason';
const calculateShards = shards => {
@ -135,7 +135,7 @@ function renderLog(log) {
);
}
function ElasticsearchPanelUi(props) {
export function ElasticsearchPanel(props) {
const clusterStats = props.cluster_stats || {};
const nodes = clusterStats.nodes;
const indices = clusterStats.indices;
@ -184,8 +184,9 @@ function ElasticsearchPanelUi(props) {
<h3>
<EuiLink
onClick={goToElasticsearch}
aria-label={props.intl.formatMessage({
id: 'xpack.monitoring.cluster.overview.esPanel.overviewLinkAriaLabel', defaultMessage: 'Elasticsearch Overview' })}
aria-label={i18n.translate('xpack.monitoring.cluster.overview.esPanel.overviewLinkAriaLabel', {
defaultMessage: 'Elasticsearch Overview'
})}
data-test-subj="esOverview"
>
<FormattedMessage
@ -204,8 +205,12 @@ function ElasticsearchPanelUi(props) {
/>
</EuiDescriptionListTitle>
<EuiDescriptionListDescription data-test-subj="esVersion">
{ props.version || props.intl.formatMessage({
id: 'xpack.monitoring.cluster.overview.esPanel.versionNotAvailableDescription', defaultMessage: 'N/A' }) }
{ props.version || i18n.translate(
'xpack.monitoring.cluster.overview.esPanel.versionNotAvailableDescription',
{
defaultMessage: 'N/A'
}
) }
</EuiDescriptionListDescription>
<EuiDescriptionListTitle>
<FormattedMessage
@ -275,10 +280,10 @@ function ElasticsearchPanelUi(props) {
<EuiLink
onClick={goToIndices}
data-test-subj="esNumberOfIndices"
aria-label={props.intl.formatMessage({
id: 'xpack.monitoring.cluster.overview.esPanel.indicesCountLinkAriaLabel',
defaultMessage: 'Elasticsearch Indices: {indicesCount}' },
{ indicesCount: formatNumber(get(indices, 'count'), 'int_commas') })}
aria-label={i18n.translate('xpack.monitoring.cluster.overview.esPanel.indicesCountLinkAriaLabel', {
defaultMessage: 'Elasticsearch Indices: {indicesCount}',
values: { indicesCount: formatNumber(get(indices, 'count'), 'int_commas') }
})}
>
<FormattedMessage
id="xpack.monitoring.cluster.overview.esPanel.indicesCountLinkLabel"
@ -339,8 +344,9 @@ function ElasticsearchPanelUi(props) {
<h3>
<EuiLink
onClick={goToElasticsearch}
aria-label={props.intl.formatMessage({
id: 'xpack.monitoring.cluster.overview.esPanel.logsLinkAriaLabel', defaultMessage: 'Elasticsearch Logs' })}
aria-label={i18n.translate('xpack.monitoring.cluster.overview.esPanel.logsLinkAriaLabel', {
defaultMessage: 'Elasticsearch Logs'
})}
data-test-subj="esLogs"
>
<FormattedMessage
@ -359,5 +365,3 @@ function ElasticsearchPanelUi(props) {
</ClusterItemContainer>
);
}
export const ElasticsearchPanel = injectI18n(ElasticsearchPanelUi);

28
x-pack/plugins/monitoring/public/components/cluster/overview/kibana_panel.js
View file

@ -19,9 +19,10 @@ import {
EuiDescriptionListDescription,
EuiHorizontalRule,
} from '@elastic/eui';
import { FormattedMessage, injectI18n } from '@kbn/i18n/react';
import { FormattedMessage } from '@kbn/i18n/react';
import { i18n } from '@kbn/i18n';
function KibanaPanelUi(props) {
export function KibanaPanel(props) {
if (!props.count) {
return null;
}
@ -38,8 +39,9 @@ function KibanaPanelUi(props) {
{...props}
statusIndicator={statusIndicator}
url="kibana"
title={props.intl.formatMessage({
id: 'xpack.monitoring.cluster.overview.kibanaPanel.kibanaTitle', defaultMessage: 'Kibana' })}
title={i18n.translate('xpack.monitoring.cluster.overview.kibanaPanel.kibanaTitle', {
defaultMessage: 'Kibana'
})}
>
<EuiFlexGrid columns={4}>
<EuiFlexItem>
@ -48,8 +50,9 @@ function KibanaPanelUi(props) {
<h3>
<EuiLink
onClick={goToKibana}
aria-label={props.intl.formatMessage({
id: 'xpack.monitoring.cluster.overview.kibanaPanel.overviewLinkAriaLabel', defaultMessage: 'Kibana Overview' })}
aria-label={i18n.translate('xpack.monitoring.cluster.overview.kibanaPanel.overviewLinkAriaLabel', {
defaultMessage: 'Kibana Overview'
})}
data-test-subj="kbnOverview"
>
<FormattedMessage
@ -93,10 +96,13 @@ function KibanaPanelUi(props) {
<EuiLink
onClick={goToInstances}
data-test-subj="kbnInstances"
aria-label={props.intl.formatMessage({
id: 'xpack.monitoring.cluster.overview.kibanaPanel.instancesCountLinkAriaLabel',
defaultMessage: 'Kibana Instances: {instancesCount}' },
{ instancesCount: props.count })}
aria-label={i18n.translate(
'xpack.monitoring.cluster.overview.kibanaPanel.instancesCountLinkAriaLabel',
{
defaultMessage: 'Kibana Instances: {instancesCount}',
values: { instancesCount: props.count }
}
)}
>
<FormattedMessage
id="xpack.monitoring.cluster.overview.kibanaPanel.instancesCountLinkLabel"
@ -133,5 +139,3 @@ function KibanaPanelUi(props) {
</ClusterItemContainer>
);
}
export const KibanaPanel = injectI18n(KibanaPanelUi);

43
x-pack/plugins/monitoring/public/components/cluster/overview/logstash_panel.js
View file

@ -22,9 +22,10 @@ import {
EuiHorizontalRule,
EuiIconTip,
} from '@elastic/eui';
import { FormattedMessage, injectI18n } from '@kbn/i18n/react';
import { FormattedMessage } from '@kbn/i18n/react';
import { i18n } from '@kbn/i18n';
function LogstashPanelUi(props) {
export function LogstashPanel(props) {
if (!props.node_count) {
return null;
}
@ -37,8 +38,9 @@ function LogstashPanelUi(props) {
<ClusterItemContainer
{...props}
url="logstash"
title={props.intl.formatMessage({
id: 'xpack.monitoring.cluster.overview.logstashPanel.logstashTitle', defaultMessage: 'Logstash' })}
title={i18n.translate('xpack.monitoring.cluster.overview.logstashPanel.logstashTitle', {
defaultMessage: 'Logstash'
})}
>
<EuiFlexGrid columns={4}>
<EuiFlexItem>
@ -47,8 +49,9 @@ function LogstashPanelUi(props) {
<h3>
<EuiLink
onClick={goToLogstash}
aria-label={props.intl.formatMessage({
id: 'xpack.monitoring.cluster.overview.logstashPanel.overviewLinkAriaLabel', defaultMessage: 'Logstash Overview' })}
aria-label={i18n.translate('xpack.monitoring.cluster.overview.logstashPanel.overviewLinkAriaLabel', {
defaultMessage: 'Logstash Overview'
})}
>
<FormattedMessage
id="xpack.monitoring.cluster.overview.logstashPanel.overviewLinkLabel"
@ -88,10 +91,12 @@ function LogstashPanelUi(props) {
<EuiLink
onClick={goToNodes}
data-test-subj="lsNodes"
aria-label={props.intl.formatMessage({
id: 'xpack.monitoring.cluster.overview.logstashPanel.nodesCountLinkAriaLabel',
defaultMessage: 'Logstash Nodes: {nodesCount}' },
{ nodesCount: props.node_count }
aria-label={i18n.translate(
'xpack.monitoring.cluster.overview.logstashPanel.nodesCountLinkAriaLabel',
{
defaultMessage: 'Logstash Nodes: {nodesCount}',
values: { nodesCount: props.node_count }
}
)}
>
<FormattedMessage
@ -136,10 +141,12 @@ function LogstashPanelUi(props) {
<EuiLink
onClick={goToPipelines}
data-test-subj="lsPipelines"
aria-label={props.intl.formatMessage({
id: 'xpack.monitoring.cluster.overview.logstashPanel.pipelineCountLinkAriaLabel',
defaultMessage: 'Logstash Pipelines (beta feature): {pipelineCount}' },
{ pipelineCount: props.pipeline_count }
aria-label={i18n.translate(
'xpack.monitoring.cluster.overview.logstashPanel.pipelineCountLinkAriaLabel',
{
defaultMessage: 'Logstash Pipelines (beta feature): {pipelineCount}',
values: { pipelineCount: props.pipeline_count }
}
)}
>
<FormattedMessage
@ -153,9 +160,9 @@ function LogstashPanelUi(props) {
</EuiFlexItem>
<EuiFlexItem grow={false}>
<EuiIconTip
content={props.intl.formatMessage({
id: 'xpack.monitoring.cluster.overview.logstashPanel.betaFeatureTooltip',
defaultMessage: 'Beta feature' })}
content={i18n.translate('xpack.monitoring.cluster.overview.logstashPanel.betaFeatureTooltip', {
defaultMessage: 'Beta feature'
})}
position="bottom"
type="beaker"
aria-label="Beta feature"
@ -185,5 +192,3 @@ function LogstashPanelUi(props) {
</ClusterItemContainer>
);
}
export const LogstashPanel = injectI18n(LogstashPanelUi);

71
x-pack/plugins/monitoring/public/components/elasticsearch/ccr/ccr.js
View file

@ -18,13 +18,14 @@ import {
} from '@elastic/eui';
import './ccr.css';
import { FormattedMessage, injectI18n } from '@kbn/i18n/react';
import { FormattedMessage } from '@kbn/i18n/react';
import { i18n } from '@kbn/i18n';
function toSeconds(ms) {
return Math.floor(ms / 1000) + 's';
}
class CcrUI extends Component {
export class Ccr extends Component {
constructor(props) {
super(props);
this.state = {
@ -33,7 +34,6 @@ class CcrUI extends Component {
}
toggleShards(index, shards) {
const { intl } = this.props;
const itemIdToExpandedRowMap = {
...this.state.itemIdToExpandedRowMap
};
@ -56,8 +56,7 @@ class CcrUI extends Component {
columns={[
{
field: 'shardId',
name: intl.formatMessage({
id: 'xpack.monitoring.elasticsearch.ccr.shardsTable.shardColumnTitle',
name: i18n.translate('xpack.monitoring.elasticsearch.ccr.shardsTable.shardColumnTitle', {
defaultMessage: 'Shard'
}),
render: shardId => {
@ -73,8 +72,7 @@ class CcrUI extends Component {
},
{
field: 'syncLagOps',
name: intl.formatMessage({
id: 'xpack.monitoring.elasticsearch.ccr.shardsTable.syncLagOpsColumnTitle',
name: i18n.translate('xpack.monitoring.elasticsearch.ccr.shardsTable.syncLagOpsColumnTitle', {
defaultMessage: 'Sync Lag (ops)'
}),
render: (syncLagOps, data) => (
@ -114,23 +112,23 @@ class CcrUI extends Component {
},
{
field: 'syncLagTime',
name: intl.formatMessage({
id: 'xpack.monitoring.elasticsearch.ccr.shardsTable.lastFetchTimeColumnTitle',
defaultMessage: 'Last fetch time'
}),
name: i18n.translate(
'xpack.monitoring.elasticsearch.ccr.shardsTable.lastFetchTimeColumnTitle',
{
defaultMessage: 'Last fetch time'
}
),
render: syncLagTime => <span>{toSeconds(syncLagTime)}</span>
},
{
field: 'opsSynced',
name: intl.formatMessage({
id: 'xpack.monitoring.elasticsearch.ccr.shardsTable.opsSyncedColumnTitle',
name: i18n.translate('xpack.monitoring.elasticsearch.ccr.shardsTable.opsSyncedColumnTitle', {
defaultMessage: 'Ops synced'
}),
},
{
field: 'error',
name: intl.formatMessage({
id: 'xpack.monitoring.elasticsearch.ccr.shardsTable.errorColumnTitle',
name: i18n.translate('xpack.monitoring.elasticsearch.ccr.shardsTable.errorColumnTitle', {
defaultMessage: 'Error'
}),
render: error => (
@ -152,7 +150,7 @@ class CcrUI extends Component {
}
renderTable() {
const { data, intl } = this.props;
const { data } = this.props;
const items = data;
let pagination = {
@ -177,8 +175,7 @@ class CcrUI extends Component {
columns={[
{
field: 'index',
name: intl.formatMessage({
id: 'xpack.monitoring.elasticsearch.ccr.ccrListingTable.indexColumnTitle',
name: i18n.translate('xpack.monitoring.elasticsearch.ccr.ccrListingTable.indexColumnTitle', {
defaultMessage: 'Index'
}),
sortable: true,
@ -196,41 +193,45 @@ class CcrUI extends Component {
{
field: 'follows',
sortable: true,
name: intl.formatMessage({
id: 'xpack.monitoring.elasticsearch.ccr.ccrListingTable.followsColumnTitle',
name: i18n.translate('xpack.monitoring.elasticsearch.ccr.ccrListingTable.followsColumnTitle', {
defaultMessage: 'Follows'
}),
},
{
field: 'syncLagOps',
sortable: true,
name: intl.formatMessage({
id: 'xpack.monitoring.elasticsearch.ccr.ccrListingTable.syncLagOpsColumnTitle',
defaultMessage: 'Sync Lag (ops)'
}),
name: i18n.translate(
'xpack.monitoring.elasticsearch.ccr.ccrListingTable.syncLagOpsColumnTitle',
{
defaultMessage: 'Sync Lag (ops)'
}
),
},
{
field: 'syncLagTime',
sortable: true,
name: intl.formatMessage({
id: 'xpack.monitoring.elasticsearch.ccr.ccrListingTable.lastFetchTimeColumnTitle',
defaultMessage: 'Last fetch time'
}),
name: i18n.translate(
'xpack.monitoring.elasticsearch.ccr.ccrListingTable.lastFetchTimeColumnTitle',
{
defaultMessage: 'Last fetch time'
}
),
render: syncLagTime => <span>{toSeconds(syncLagTime)}</span>
},
{
field: 'opsSynced',
sortable: true,
name: intl.formatMessage({
id: 'xpack.monitoring.elasticsearch.ccr.ccrListingTable.opsSyncedColumnTitle',
defaultMessage: 'Ops synced'
}),
name: i18n.translate(
'xpack.monitoring.elasticsearch.ccr.ccrListingTable.opsSyncedColumnTitle',
{
defaultMessage: 'Ops synced'
}
),
},
{
field: 'error',
sortable: true,
name: intl.formatMessage({
id: 'xpack.monitoring.elasticsearch.ccr.ccrListingTable.errorColumnTitle',
name: i18n.translate('xpack.monitoring.elasticsearch.ccr.ccrListingTable.errorColumnTitle', {
defaultMessage: 'Error'
}),
render: error => (
@ -266,5 +267,3 @@ class CcrUI extends Component {
);
}
}
export const Ccr = injectI18n(CcrUI);

4
x-pack/plugins/monitoring/public/components/elasticsearch/ccr/ccr.test.js
View file

@ -5,7 +5,7 @@
*/
import React from 'react';
import { shallowWithIntl } from '../../../../../../test_utils/enzyme_helpers';
import { shallow } from 'enzyme';
import { Ccr } from './ccr';
describe('Ccr', () => {
@ -67,7 +67,7 @@ describe('Ccr', () => {
}
];
const component = shallowWithIntl(<Ccr.WrappedComponent data={data} />);
const component = shallow(<Ccr data={data} />);
expect(component).toMatchSnapshot();
});
});

6
x-pack/plugins/monitoring/public/components/elasticsearch/ccr_shard/__snapshots__/ccr_shard.test.js.snap generated
View file

@ -65,7 +65,7 @@ exports[`CcrShard that it renders normally 1`] = `
<EuiPageBody
restrictWidth={false}
>
<InjectIntl(StatusUI)
<Status
formattedLeader="leader on remote"
oldestStat={
Object {
@ -120,7 +120,7 @@ exports[`CcrShard that it renders normally 1`] = `
hasShadow={false}
paddingSize="m"
>
<InjectIntl(MonitoringTimeseriesContainerUI) />
<MonitoringTimeseriesContainer />
</EuiPanel>
</EuiFlexItem>
<EuiFlexItem
@ -136,7 +136,7 @@ exports[`CcrShard that it renders normally 1`] = `
hasShadow={false}
paddingSize="m"
>
<InjectIntl(MonitoringTimeseriesContainerUI) />
<MonitoringTimeseriesContainer />
</EuiPanel>
</EuiFlexItem>
</EuiFlexGroup>

15
x-pack/plugins/monitoring/public/components/elasticsearch/ccr_shard/ccr_shard.js
View file

@ -22,9 +22,10 @@ import {
import { MonitoringTimeseriesContainer } from '../../chart';
import { Status } from './status';
import { formatDateTimeLocal } from '../../../../common/formatting';
import { FormattedMessage, injectI18n } from '@kbn/i18n/react';
import { FormattedMessage } from '@kbn/i18n/react';
import { i18n } from '@kbn/i18n';
class CcrShardUI extends PureComponent {
export class CcrShard extends PureComponent {
renderCharts() {
const { metrics } = this.props;
const seriesToShow = [
@ -50,7 +51,7 @@ class CcrShardUI extends PureComponent {
}
renderErrors() {
const { stat, intl } = this.props;
const { stat } = this.props;
if (stat.read_exceptions && stat.read_exceptions.length > 0) {
return (
<Fragment>
@ -70,15 +71,13 @@ class CcrShardUI extends PureComponent {
items={stat.read_exceptions}
columns={[
{
name: intl.formatMessage({
id: 'xpack.monitoring.elasticsearch.ccrShard.errorsTable.typeColumnTitle',
name: i18n.translate('xpack.monitoring.elasticsearch.ccrShard.errorsTable.typeColumnTitle', {
defaultMessage: 'Type'
}),
field: 'exception.type'
},
{
name: intl.formatMessage({
id: 'xpack.monitoring.elasticsearch.ccrShard.errorsTable.reasonColumnTitle',
name: i18n.translate('xpack.monitoring.elasticsearch.ccrShard.errorsTable.reasonColumnTitle', {
defaultMessage: 'Reason'
}),
field: 'exception.reason',
@ -144,5 +143,3 @@ class CcrShardUI extends PureComponent {
);
}
}
export const CcrShard = injectI18n(CcrShardUI);

6
x-pack/plugins/monitoring/public/components/elasticsearch/ccr_shard/ccr_shard.test.js
View file

@ -5,7 +5,7 @@
*/
import React from 'react';
import { shallowWithIntl } from '../../../../../../test_utils/enzyme_helpers';
import { shallow } from 'enzyme';
import { CcrShard } from './ccr_shard';
describe('CcrShard', () => {
@ -45,7 +45,7 @@ describe('CcrShard', () => {
};
test('that it renders normally', () => {
const component = shallowWithIntl(<CcrShard.WrappedComponent {...props} />);
const component = shallow(<CcrShard {...props} />);
expect(component).toMatchSnapshot();
});
@ -63,7 +63,7 @@ describe('CcrShard', () => {
}
};
const component = shallowWithIntl(<CcrShard.WrappedComponent {...localProps} />);
const component = shallow(<CcrShard {...localProps} />);
expect(component.find('EuiPanel').get(0)).toMatchSnapshot();
});
});

31
x-pack/plugins/monitoring/public/components/elasticsearch/ccr_shard/status.js
View file

@ -7,9 +7,9 @@
import React from 'react';
import { SummaryStatus } from '../../summary_status';
import { formatMetric } from '../../../lib/format_number';
import { injectI18n } from '@kbn/i18n/react';
import { i18n } from '@kbn/i18n';
function StatusUI({ stat, formattedLeader, oldestStat, intl }) {
export function Status({ stat, formattedLeader, oldestStat }) {
const {
follower_index: followerIndex,
shard_id: shardId,
@ -24,41 +24,36 @@ function StatusUI({ stat, formattedLeader, oldestStat, intl }) {
const metrics = [
{
label: intl.formatMessage({
id: 'xpack.monitoring.elasticsearch.ccrShard.status.followerIndexLabel',
defaultMessage: 'Follower Index',
label: i18n.translate('xpack.monitoring.elasticsearch.ccrShard.status.followerIndexLabel', {
defaultMessage: 'Follower Index'
}),
value: followerIndex,
'data-test-subj': 'followerIndex'
},
{
label: intl.formatMessage({
id: 'xpack.monitoring.elasticsearch.ccrShard.status.shardIdLabel',
defaultMessage: 'Shard Id',
label: i18n.translate('xpack.monitoring.elasticsearch.ccrShard.status.shardIdLabel', {
defaultMessage: 'Shard Id'
}),
value: shardId,
'data-test-subj': 'shardId'
},
{
label: intl.formatMessage({
id: 'xpack.monitoring.elasticsearch.ccrShard.status.leaderIndexLabel',
defaultMessage: 'Leader Index',
label: i18n.translate('xpack.monitoring.elasticsearch.ccrShard.status.leaderIndexLabel', {
defaultMessage: 'Leader Index'
}),
value: formattedLeader,
'data-test-subj': 'leaderIndex'
},
{
label: intl.formatMessage({
id: 'xpack.monitoring.elasticsearch.ccrShard.status.opsSyncedLabel',
defaultMessage: 'Ops Synced',
label: i18n.translate('xpack.monitoring.elasticsearch.ccrShard.status.opsSyncedLabel', {
defaultMessage: 'Ops Synced'
}),
value: formatMetric(operationsReceived - oldestOperationsReceived, 'int_commas'),
'data-test-subj': 'operationsReceived'
},
{
label: intl.formatMessage({
id: 'xpack.monitoring.elasticsearch.ccrShard.status.failedFetchesLabel',
defaultMessage: 'Failed Fetches',
label: i18n.translate('xpack.monitoring.elasticsearch.ccrShard.status.failedFetchesLabel', {
defaultMessage: 'Failed Fetches'
}),
value: formatMetric(failedFetches - oldestFailedFetches, 'int_commas'),
'data-test-subj': 'failedFetches'
@ -72,5 +67,3 @@ function StatusUI({ stat, formattedLeader, oldestStat, intl }) {
/>
);
}
export const Status = injectI18n(StatusUI);

41
x-pack/plugins/monitoring/public/components/elasticsearch/cluster_status/index.js
View file

@ -8,9 +8,9 @@ import React from 'react';
import { SummaryStatus } from '../../summary_status';
import { ElasticsearchStatusIcon } from '../status_icon';
import { formatMetric } from '../../../lib/format_number';
import { injectI18n } from '@kbn/i18n/react';
import { i18n } from '@kbn/i18n';
function ClusterStatusUI({ stats, intl }) {
export function ClusterStatus({ stats }) {
const {
dataSize,
nodesCount,
@ -25,57 +25,50 @@ function ClusterStatusUI({ stats, intl }) {
const metrics = [
{
label: intl.formatMessage({
id: 'xpack.monitoring.elasticsearch.clusterStatus.nodesLabel',
defaultMessage: 'Nodes',
label: i18n.translate('xpack.monitoring.elasticsearch.clusterStatus.nodesLabel', {
defaultMessage: 'Nodes'
}),
value: nodesCount,
'data-test-subj': 'nodesCount'
},
{
label: intl.formatMessage({
id: 'xpack.monitoring.elasticsearch.clusterStatus.indicesLabel',
defaultMessage: 'Indices',
label: i18n.translate('xpack.monitoring.elasticsearch.clusterStatus.indicesLabel', {
defaultMessage: 'Indices'
}),
value: indicesCount,
'data-test-subj': 'indicesCount'
},
{
label: intl.formatMessage({
id: 'xpack.monitoring.elasticsearch.clusterStatus.memoryLabel',
defaultMessage: 'Memory',
label: i18n.translate('xpack.monitoring.elasticsearch.clusterStatus.memoryLabel', {
defaultMessage: 'Memory'
}),
value: formatMetric(memUsed, 'byte') + ' / ' + formatMetric(memMax, 'byte'),
'data-test-subj': 'memory'
},
{
label: intl.formatMessage({
id: 'xpack.monitoring.elasticsearch.clusterStatus.totalShardsLabel',
defaultMessage: 'Total Shards',
label: i18n.translate('xpack.monitoring.elasticsearch.clusterStatus.totalShardsLabel', {
defaultMessage: 'Total Shards'
}),
value: totalShards,
'data-test-subj': 'totalShards'
},
{
label: intl.formatMessage({
id: 'xpack.monitoring.elasticsearch.clusterStatus.unassignedShardsLabel',
defaultMessage: 'Unassigned Shards',
label: i18n.translate('xpack.monitoring.elasticsearch.clusterStatus.unassignedShardsLabel', {
defaultMessage: 'Unassigned Shards'
}),
value: unassignedShards,
'data-test-subj': 'unassignedShards'
},
{
label: intl.formatMessage({
id: 'xpack.monitoring.elasticsearch.clusterStatus.documentsLabel',
defaultMessage: 'Documents',
label: i18n.translate('xpack.monitoring.elasticsearch.clusterStatus.documentsLabel', {
defaultMessage: 'Documents'
}),
value: formatMetric(documentCount, 'int_commas'),
'data-test-subj': 'documentCount'
},
{
label: intl.formatMessage({
id: 'xpack.monitoring.elasticsearch.clusterStatus.dataLabel',
defaultMessage: 'Data',
label: i18n.translate('xpack.monitoring.elasticsearch.clusterStatus.dataLabel', {
defaultMessage: 'Data'
}),
value: formatMetric(dataSize, 'byte'),
'data-test-subj': 'dataSize'
@ -95,5 +88,3 @@ function ClusterStatusUI({ stats, intl }) {
/>
);
}
export const ClusterStatus = injectI18n(ClusterStatusUI);

37
x-pack/plugins/monitoring/public/components/elasticsearch/index_detail_status/index.js
View file

@ -8,9 +8,10 @@ import React, { Fragment } from 'react';
import { SummaryStatus } from '../../summary_status';
import { ElasticsearchStatusIcon } from '../status_icon';
import { formatMetric } from '../../../lib/format_number';
import { FormattedMessage, injectI18n } from '@kbn/i18n/react';
import { FormattedMessage } from '@kbn/i18n/react';
import { i18n } from '@kbn/i18n';
function IndexDetailStatusUI({ stats, intl }) {
export function IndexDetailStatus({ stats }) {
const {
dataSize,
documents: documentCount,
@ -21,42 +22,40 @@ function IndexDetailStatusUI({ stats, intl }) {
const metrics = [
{
label: intl.formatMessage({
id: 'xpack.monitoring.elasticsearch.indexDetailStatus.totalTitle',
defaultMessage: 'Total',
label: i18n.translate('xpack.monitoring.elasticsearch.indexDetailStatus.totalTitle', {
defaultMessage: 'Total'
}),
value: formatMetric(dataSize.total, '0.0 b'),
'data-test-subj': 'dataSize'
},
{
label: intl.formatMessage({
id: 'xpack.monitoring.elasticsearch.indexDetailStatus.primariesTitle',
defaultMessage: 'Primaries',
label: i18n.translate('xpack.monitoring.elasticsearch.indexDetailStatus.primariesTitle', {
defaultMessage: 'Primaries'
}),
value: formatMetric(dataSize.primaries, '0.0 b'),
'data-test-subj': 'dataSizePrimaries'
},
{
label: intl.formatMessage({
id: 'xpack.monitoring.elasticsearch.indexDetailStatus.documentsTitle',
defaultMessage: 'Documents',
label: i18n.translate('xpack.monitoring.elasticsearch.indexDetailStatus.documentsTitle', {
defaultMessage: 'Documents'
}),
value: formatMetric(documentCount, '0.[0]a'),
'data-test-subj': 'documentCount'
},
{
label: intl.formatMessage({
id: 'xpack.monitoring.elasticsearch.indexDetailStatus.totalShardsTitle',
defaultMessage: 'Total Shards',
label: i18n.translate('xpack.monitoring.elasticsearch.indexDetailStatus.totalShardsTitle', {
defaultMessage: 'Total Shards'
}),
value: formatMetric(totalShards, 'int_commas'),
'data-test-subj': 'totalShards'
},
{
label: intl.formatMessage({
id: 'xpack.monitoring.elasticsearch.indexDetailStatus.unassignedShardsTitle',
defaultMessage: 'Unassigned Shards',
}),
label: i18n.translate(
'xpack.monitoring.elasticsearch.indexDetailStatus.unassignedShardsTitle',
{
defaultMessage: 'Unassigned Shards'
}
),
value: formatMetric(unassignedShards, 'int_commas'),
'data-test-subj': 'unassignedShards'
}
@ -85,5 +84,3 @@ function IndexDetailStatusUI({ stats, intl }) {
/>
);
}
export const IndexDetailStatus = injectI18n(IndexDetailStatusUI);

12
x-pack/plugins/monitoring/public/components/elasticsearch/indices/indices.js
View file

@ -21,7 +21,7 @@ import {
EuiSpacer,
} from '@elastic/eui';
import { i18n } from '@kbn/i18n';
import { FormattedMessage, injectI18n } from '@kbn/i18n/react';
import { FormattedMessage } from '@kbn/i18n/react';
const columns = [
{
@ -136,10 +136,9 @@ const getNoDataMessage = () => {
);
};
const ElasticsearchIndicesUI = ({
export const ElasticsearchIndices = ({
clusterStatus,
indices,
intl,
sorting,
pagination,
onTableChange,
@ -175,9 +174,8 @@ const ElasticsearchIndicesUI = ({
search={{
box: {
incremental: true,
placeholder: intl.formatMessage({
id: 'xpack.monitoring.elasticsearch.indices.monitoringTablePlaceholder',
defaultMessage: 'Filter Indices…',
placeholder: i18n.translate('xpack.monitoring.elasticsearch.indices.monitoringTablePlaceholder', {
defaultMessage: 'Filter Indices…'
})
},
}}
@ -191,5 +189,3 @@ const ElasticsearchIndicesUI = ({
</EuiPage>
);
};
export const ElasticsearchIndices = injectI18n(ElasticsearchIndicesUI);

14
x-pack/plugins/monitoring/public/components/elasticsearch/ml_job_listing/status_icon.js
View file

@ -6,9 +6,9 @@
import React from 'react';
import { StatusIcon } from 'plugins/monitoring/components/status_icon';
import { injectI18n } from '@kbn/i18n/react';
import { i18n } from '@kbn/i18n';
export function MachineLearningJobStatusIconUI({ status, intl }) {
export function MachineLearningJobStatusIcon({ status }) {
const type = (() => {
const statusKey = status.toUpperCase();
@ -27,12 +27,10 @@ export function MachineLearningJobStatusIconUI({ status, intl }) {
return (
<StatusIcon
type={type}
label={intl.formatMessage({
id: 'xpack.monitoring.elasticsearch.mlJobListing.statusIconLabel',
defaultMessage: 'Job Status: {status}' }, { status }
)}
label={i18n.translate('xpack.monitoring.elasticsearch.mlJobListing.statusIconLabel', {
defaultMessage: 'Job Status: {status}',
values: { status }
})}
/>
);
}
export const MachineLearningJobStatusIcon = injectI18n(MachineLearningJobStatusIconUI);

14
x-pack/plugins/monitoring/public/components/elasticsearch/node/status_icon.js
View file

@ -6,20 +6,18 @@
import React from 'react';
import { StatusIcon } from '../../status_icon';
import { injectI18n } from '@kbn/i18n/react';
import { i18n } from '@kbn/i18n';
export function NodeStatusIconUI({ isOnline, status, intl }) {
export function NodeStatusIcon({ isOnline, status }) {
const type = isOnline ? StatusIcon.TYPES.GREEN : StatusIcon.TYPES.GRAY;
return (
<StatusIcon
type={type}
label={intl.formatMessage({
id: 'xpack.monitoring.elasticsearch.node.statusIconLabel',
defaultMessage: 'Status: {status}' }, { status }
)}
label={i18n.translate('xpack.monitoring.elasticsearch.node.statusIconLabel', {
defaultMessage: 'Status: {status}',
values: { status }
})}
/>
);
}
export const NodeStatusIcon = injectI18n(NodeStatusIconUI);

51
x-pack/plugins/monitoring/public/components/elasticsearch/node_detail_status/index.js
View file

@ -8,9 +8,9 @@ import React, { Fragment } from 'react';
import { SummaryStatus } from '../../summary_status';
import { NodeStatusIcon } from '../node';
import { formatMetric } from '../../../lib/format_number';
import { injectI18n } from '@kbn/i18n/react';
import { i18n } from '@kbn/i18n';
function NodeDetailStatusUI({ stats, intl }) {
export function NodeDetailStatus({ stats }) {
const {
transport_address: transportAddress,
usedHeap,
@ -26,66 +26,61 @@ function NodeDetailStatusUI({ stats, intl }) {
const metrics = [
{
label: intl.formatMessage({
id: 'xpack.monitoring.elasticsearch.nodeDetailStatus.transportAddress',
defaultMessage: 'Transport Address',
label: i18n.translate('xpack.monitoring.elasticsearch.nodeDetailStatus.transportAddress', {
defaultMessage: 'Transport Address'
}),
value: transportAddress,
'data-test-subj': 'transportAddress'
},
{
label: intl.formatMessage({
id: 'xpack.monitoring.elasticsearch.nodeDetailStatus.jvmHeapLabel',
defaultMessage: '{javaVirtualMachine} Heap' }, {
javaVirtualMachine: 'JVM'
label: i18n.translate('xpack.monitoring.elasticsearch.nodeDetailStatus.jvmHeapLabel', {
defaultMessage: '{javaVirtualMachine} Heap',
values: {
javaVirtualMachine: 'JVM'
}
}),
value: formatMetric(usedHeap, '0,0.[00]', '%', { prependSpace: false }),
'data-test-subj': 'jvmHeap'
},
{
label: intl.formatMessage({
id: 'xpack.monitoring.elasticsearch.nodeDetailStatus.freeDiskSpaceLabel',
defaultMessage: 'Free Disk Space',
label: i18n.translate('xpack.monitoring.elasticsearch.nodeDetailStatus.freeDiskSpaceLabel', {
defaultMessage: 'Free Disk Space'
}),
value: formatMetric(freeSpace, '0.0 b'),
'data-test-subj': 'freeDiskSpace'
},
{
label: intl.formatMessage({
id: 'xpack.monitoring.elasticsearch.nodeDetailStatus.documentsLabel',
defaultMessage: 'Documents',
label: i18n.translate('xpack.monitoring.elasticsearch.nodeDetailStatus.documentsLabel', {
defaultMessage: 'Documents'
}),
value: formatMetric(documents, '0.[0]a'),
'data-test-subj': 'documentCount'
},
{
label: intl.formatMessage({
id: 'xpack.monitoring.elasticsearch.nodeDetailStatus.dataLabel',
defaultMessage: 'Data',
label: i18n.translate('xpack.monitoring.elasticsearch.nodeDetailStatus.dataLabel', {
defaultMessage: 'Data'
}),
value: formatMetric(dataSize, '0.0 b'),
'data-test-subj': 'dataSize'
},
{
label: intl.formatMessage({
id: 'xpack.monitoring.elasticsearch.nodeDetailStatus.indicesLabel',
defaultMessage: 'Indices',
label: i18n.translate('xpack.monitoring.elasticsearch.nodeDetailStatus.indicesLabel', {
defaultMessage: 'Indices'
}),
value: formatMetric(indexCount, 'int_commas'),
'data-test-subj': 'indicesCount'
},
{
label: intl.formatMessage({
id: 'xpack.monitoring.elasticsearch.nodeDetailStatus.shardsLabel',
defaultMessage: 'Shards',
label: i18n.translate('xpack.monitoring.elasticsearch.nodeDetailStatus.shardsLabel', {
defaultMessage: 'Shards'
}),
value: formatMetric(totalShards, 'int_commas'),
'data-test-subj': 'shardsCount'
},
{
label: intl.formatMessage({
id: 'xpack.monitoring.elasticsearch.nodeDetailStatus.typeLabel',
defaultMessage: 'Type',
label: i18n.translate('xpack.monitoring.elasticsearch.nodeDetailStatus.typeLabel', {
defaultMessage: 'Type'
}),
value: nodeTypeLabel,
'data-test-subj': 'nodeType'
@ -108,5 +103,3 @@ function NodeDetailStatusUI({ stats, intl }) {
/>
);
}
export const NodeDetailStatus = injectI18n(NodeDetailStatusUI);

10
x-pack/plugins/monitoring/public/components/elasticsearch/nodes/nodes.js
View file

@ -21,7 +21,6 @@ import {
EuiText
} from '@elastic/eui';
import { i18n } from '@kbn/i18n';
import { injectI18n } from '@kbn/i18n/react';
import _ from 'lodash';
const getSortHandler = (type) => (item) => _.get(item, [type, 'summary', 'lastVal']);
@ -206,7 +205,7 @@ const getColumns = showCgroupMetricsElasticsearch => {
return cols;
};
function ElasticsearchNodesUI({ clusterStatus, nodes, showCgroupMetricsElasticsearch, intl, ...props }) {
export function ElasticsearchNodes({ clusterStatus, nodes, showCgroupMetricsElasticsearch, ...props }) {
const columns = getColumns(showCgroupMetricsElasticsearch);
const { sorting, pagination, onTableChange } = props;
@ -227,9 +226,8 @@ function ElasticsearchNodesUI({ clusterStatus, nodes, showCgroupMetricsElasticse
search={{
box: {
incremental: true,
placeholder: intl.formatMessage({
id: 'xpack.monitoring.elasticsearch.nodes.monitoringTablePlaceholder',
defaultMessage: 'Filter Nodes…',
placeholder: i18n.translate('xpack.monitoring.elasticsearch.nodes.monitoringTablePlaceholder', {
defaultMessage: 'Filter Nodes…'
}),
},
}}
@ -243,5 +241,3 @@ function ElasticsearchNodesUI({ clusterStatus, nodes, showCgroupMetricsElasticse
</EuiPage>
);
}
export const ElasticsearchNodes = injectI18n(ElasticsearchNodesUI);

9
x-pack/plugins/monitoring/public/components/elasticsearch/shard_activity/shard_activity.js
View file

@ -13,7 +13,7 @@ import { SourceDestination } from './source_destination';
import { FilesProgress, BytesProgress, TranslogProgress } from './progress';
import { parseProps } from './parse_props';
import { i18n } from '@kbn/i18n';
import { FormattedMessage, injectI18n } from '@kbn/i18n/react';
import { FormattedMessage } from '@kbn/i18n/react';
const columns = [
{
@ -67,7 +67,7 @@ const columns = [
];
class ShardActivityUI extends React.Component {
export class ShardActivity extends React.Component {
constructor(props) {
super(props);
this.getNoDataMessage = this.getNoDataMessage.bind(this);
@ -75,8 +75,7 @@ class ShardActivityUI extends React.Component {
getNoDataMessage() {
if (this.props.showShardActivityHistory) {
return this.props.intl.formatMessage({
id: 'xpack.monitoring.elasticsearch.shardActivity.noDataMessage',
return i18n.translate('xpack.monitoring.elasticsearch.shardActivity.noDataMessage', {
defaultMessage: 'There are no historical shard activity records for the selected time range.'
});
}
@ -163,5 +162,3 @@ class ShardActivityUI extends React.Component {
);
}
}
export const ShardActivity = injectI18n(ShardActivityUI);

15
x-pack/plugins/monitoring/public/components/elasticsearch/status_icon.js
View file

@ -6,9 +6,9 @@
import React from 'react';
import { StatusIcon } from '../status_icon';
import { injectI18n } from '@kbn/i18n/react';
import { i18n } from '@kbn/i18n';
function ElasticsearchStatusIconUI({ intl, status }) {
export function ElasticsearchStatusIcon({ status }) {
const type = (() => {
const statusKey = status.toUpperCase();
return StatusIcon.TYPES[statusKey] || StatusIcon.TYPES.GRAY;
@ -17,14 +17,13 @@ function ElasticsearchStatusIconUI({ intl, status }) {
return (
<StatusIcon
type={type}
label={intl.formatMessage({
id: 'xpack.monitoring.elasticsearch.healthStatusLabel',
defaultMessage: 'Health: {status}' }, {
status
label={i18n.translate('xpack.monitoring.elasticsearch.healthStatusLabel', {
defaultMessage: 'Health: {status}',
values: {
status
}
})
}
/>
);
}
export const ElasticsearchStatusIcon = injectI18n(ElasticsearchStatusIconUI);

21
x-pack/plugins/monitoring/public/components/kibana/cluster_status/index.js
View file

@ -8,9 +8,9 @@ import React from 'react';
import { SummaryStatus } from '../../summary_status';
import { KibanaStatusIcon } from '../status_icon';
import { formatMetric } from '../../../lib/format_number';
import { injectI18n } from '@kbn/i18n/react';
import { i18n } from '@kbn/i18n';
function ClusterStatusUI({ stats, intl }) {
export function ClusterStatus({ stats }) {
const {
concurrent_connections: connections,
count: instances,
@ -23,40 +23,35 @@ function ClusterStatusUI({ stats, intl }) {
const metrics = [
{
label: intl.formatMessage({
id: 'xpack.monitoring.kibana.clusterStatus.instancesLabel',
label: i18n.translate('xpack.monitoring.kibana.clusterStatus.instancesLabel', {
defaultMessage: 'Instances'
}),
value: instances,
'data-test-subj': 'instances'
},
{
label: intl.formatMessage({
id: 'xpack.monitoring.kibana.clusterStatus.memoryLabel',
label: i18n.translate('xpack.monitoring.kibana.clusterStatus.memoryLabel', {
defaultMessage: 'Memory'
}),
value: formatMetric(memSize, 'byte') + ' / ' + formatMetric(memLimit, 'byte'),
'data-test-subj': 'memory'
},
{
label: intl.formatMessage({
id: 'xpack.monitoring.kibana.clusterStatus.requestsLabel',
label: i18n.translate('xpack.monitoring.kibana.clusterStatus.requestsLabel', {
defaultMessage: 'Requests'
}),
value: requests,
'data-test-subj': 'requests'
},
{
label: intl.formatMessage({
id: 'xpack.monitoring.kibana.clusterStatus.connectionsLabel',
label: i18n.translate('xpack.monitoring.kibana.clusterStatus.connectionsLabel', {
defaultMessage: 'Connections'
}),
value: connections,
'data-test-subj': 'connections'
},
{
label: intl.formatMessage({
id: 'xpack.monitoring.kibana.clusterStatus.maxResponseTimeLabel',
label: i18n.translate('xpack.monitoring.kibana.clusterStatus.maxResponseTimeLabel', {
defaultMessage: 'Max. Response Time'
}),
value: formatMetric(maxResponseTime, '0', 'ms'),
@ -77,5 +72,3 @@ function ClusterStatusUI({ stats, intl }) {
/>
);
}
export const ClusterStatus = injectI18n(ClusterStatusUI);

18
x-pack/plugins/monitoring/public/components/kibana/detail_status/index.js
View file

@ -8,9 +8,9 @@ import React from 'react';
import { SummaryStatus } from '../../summary_status';
import { KibanaStatusIcon } from '../status_icon';
import { formatMetric } from '../../../lib/format_number';
import { injectI18n } from '@kbn/i18n/react';
import { i18n } from '@kbn/i18n';
function DetailStatusUI({ stats, intl }) {
export function DetailStatus({ stats }) {
const {
transport_address: transportAddress,
os_memory_free: osFreeMemory,
@ -21,32 +21,28 @@ function DetailStatusUI({ stats, intl }) {
const metrics = [
{
label: intl.formatMessage({
id: 'xpack.monitoring.kibana.detailStatus.transportAddressLabel',
label: i18n.translate('xpack.monitoring.kibana.detailStatus.transportAddressLabel', {
defaultMessage: 'Transport Address'
}),
value: transportAddress,
'data-test-subj': 'transportAddress'
},
{
label: intl.formatMessage({
id: 'xpack.monitoring.kibana.detailStatus.osFreeMemoryLabel',
label: i18n.translate('xpack.monitoring.kibana.detailStatus.osFreeMemoryLabel', {
defaultMessage: 'OS Free Memory'
}),
value: formatMetric(osFreeMemory, 'byte'),
'data-test-subj': 'osFreeMemory'
},
{
label: intl.formatMessage({
id: 'xpack.monitoring.kibana.detailStatus.versionLabel',
label: i18n.translate('xpack.monitoring.kibana.detailStatus.versionLabel', {
defaultMessage: 'Version'
}),
value: version,
'data-test-subj': 'version'
},
{
label: intl.formatMessage({
id: 'xpack.monitoring.kibana.detailStatus.uptimeLabel',
label: i18n.translate('xpack.monitoring.kibana.detailStatus.uptimeLabel', {
defaultMessage: 'Uptime'
}),
value: formatMetric(uptime, 'time_since'),
@ -67,5 +63,3 @@ function DetailStatusUI({ stats, intl }) {
/>
);
}
export const DetailStatus = injectI18n(DetailStatusUI);

15
x-pack/plugins/monitoring/public/components/kibana/status_icon.js
View file

@ -6,9 +6,9 @@
import React from 'react';
import { StatusIcon } from 'plugins/monitoring/components/status_icon';
import { injectI18n } from '@kbn/i18n/react';
import { i18n } from '@kbn/i18n';
function KibanaStatusIconUI({ status, availability = true, intl }) {
export function KibanaStatusIcon({ status, availability = true }) {
const type = (() => {
if (!availability) {
return StatusIcon.TYPES.GRAY;
@ -21,13 +21,12 @@ function KibanaStatusIconUI({ status, availability = true, intl }) {
return (
<StatusIcon
type={type}
label={intl.formatMessage({
id: 'xpack.monitoring.kibana.statusIconLabel',
defaultMessage: 'Health: {status}' }, {
status
label={i18n.translate('xpack.monitoring.kibana.statusIconLabel', {
defaultMessage: 'Health: {status}',
values: {
status
}
})}
/>
);
}
export const KibanaStatusIcon = injectI18n(KibanaStatusIconUI);

22
x-pack/plugins/monitoring/public/components/logstash/cluster_status/index.js
View file

@ -7,9 +7,9 @@
import React from 'react';
import { SummaryStatus } from '../../summary_status';
import { formatMetric } from '../../../lib/format_number';
import { injectI18n } from '@kbn/i18n/react';
import { i18n } from '@kbn/i18n';
function ClusterStatusUi({ stats, intl }) {
export function ClusterStatus({ stats }) {
const {
node_count: nodeCount,
avg_memory_used: avgMemoryUsed,
@ -20,29 +20,29 @@ function ClusterStatusUi({ stats, intl }) {
const metrics = [
{
label: intl.formatMessage({
id: 'xpack.monitoring.logstash.clusterStatus.nodesLabel', defaultMessage: 'Nodes'
label: i18n.translate('xpack.monitoring.logstash.clusterStatus.nodesLabel', {
defaultMessage: 'Nodes'
}),
value: nodeCount,
'data-test-subj': 'node_count'
},
{
label: intl.formatMessage({
id: 'xpack.monitoring.logstash.clusterStatus.memoryLabel', defaultMessage: 'Memory'
label: i18n.translate('xpack.monitoring.logstash.clusterStatus.memoryLabel', {
defaultMessage: 'Memory'
}),
value: formatMetric(avgMemoryUsed, 'byte') + ' / ' + formatMetric(avgMemory, 'byte'),
'data-test-subj': 'memory_used'
},
{
label: intl.formatMessage({
id: 'xpack.monitoring.logstash.clusterStatus.eventsReceivedLabel', defaultMessage: 'Events Received'
label: i18n.translate('xpack.monitoring.logstash.clusterStatus.eventsReceivedLabel', {
defaultMessage: 'Events Received'
}),
value: formatMetric(eventsInTotal, '0.[0]a'),
'data-test-subj': 'events_in_total'
},
{
label: intl.formatMessage({
id: 'xpack.monitoring.logstash.clusterStatus.eventsEmittedLabel', defaultMessage: 'Events Emitted'
label: i18n.translate('xpack.monitoring.logstash.clusterStatus.eventsEmittedLabel', {
defaultMessage: 'Events Emitted'
}),
value: formatMetric(eventsOutTotal, '0.[0]a'),
'data-test-subj': 'events_out_total'
@ -56,5 +56,3 @@ function ClusterStatusUi({ stats, intl }) {
/>
);
}
export const ClusterStatus = injectI18n(ClusterStatusUi);

42
x-pack/plugins/monitoring/public/components/logstash/detail_status/index.js
View file

@ -7,9 +7,9 @@
import React from 'react';
import { SummaryStatus } from '../../summary_status';
import { formatMetric } from '../../../lib/format_number';
import { injectI18n } from '@kbn/i18n/react';
import { i18n } from '@kbn/i18n';
function DetailStatusUi({ stats, intl }) {
export function DetailStatus({ stats }) {
const {
http_address: httpAddress,
events,
@ -22,43 +22,43 @@ function DetailStatusUi({ stats, intl }) {
const firstMetrics = [
{
label: intl.formatMessage({
id: 'xpack.monitoring.logstash.detailStatus.transportAddressLabel', defaultMessage: 'Transport Address'
label: i18n.translate('xpack.monitoring.logstash.detailStatus.transportAddressLabel', {
defaultMessage: 'Transport Address'
}),
value: httpAddress,
'data-test-subj': 'httpAddress'
},
{
label: intl.formatMessage({
id: 'xpack.monitoring.logstash.detailStatus.eventsReceivedLabel', defaultMessage: 'Events Received'
label: i18n.translate('xpack.monitoring.logstash.detailStatus.eventsReceivedLabel', {
defaultMessage: 'Events Received'
}),
value: formatMetric(events.in, '0.[0]a'),
'data-test-subj': 'eventsIn'
},
{
label: intl.formatMessage({
id: 'xpack.monitoring.logstash.detailStatus.eventsEmittedLabel', defaultMessage: 'Events Emitted'
label: i18n.translate('xpack.monitoring.logstash.detailStatus.eventsEmittedLabel', {
defaultMessage: 'Events Emitted'
}),
value: formatMetric(events.out, '0.[0]a'),
'data-test-subj': 'eventsOut'
},
{
label: intl.formatMessage({
id: 'xpack.monitoring.logstash.detailStatus.configReloadsLabel', defaultMessage: 'Config Reloads'
label: i18n.translate('xpack.monitoring.logstash.detailStatus.configReloadsLabel', {
defaultMessage: 'Config Reloads'
}),
value: reloads.successes,
'data-test-subj': 'numReloads'
},
{
label: intl.formatMessage({
id: 'xpack.monitoring.logstash.detailStatus.pipelineWorkersLabel', defaultMessage: 'Pipeline Workers'
label: i18n.translate('xpack.monitoring.logstash.detailStatus.pipelineWorkersLabel', {
defaultMessage: 'Pipeline Workers'
}),
value: pipeline.workers,
'data-test-subj': 'pipelineWorkers'
},
{
label: intl.formatMessage({
id: 'xpack.monitoring.logstash.detailStatus.batchSizeLabel', defaultMessage: 'Batch Size'
label: i18n.translate('xpack.monitoring.logstash.detailStatus.batchSizeLabel', {
defaultMessage: 'Batch Size'
}),
value: pipeline.batch_size,
'data-test-subj': 'pipelineBatchSize'
@ -67,15 +67,15 @@ function DetailStatusUi({ stats, intl }) {
const lastMetrics = [
{
label: intl.formatMessage({
id: 'xpack.monitoring.logstash.detailStatus.versionLabel', defaultMessage: 'Version'
label: i18n.translate('xpack.monitoring.logstash.detailStatus.versionLabel', {
defaultMessage: 'Version'
}),
value: version,
'data-test-subj': 'version'
},
{
label: intl.formatMessage({
id: 'xpack.monitoring.logstash.detailStatus.uptimeLabel', defaultMessage: 'Uptime'
label: i18n.translate('xpack.monitoring.logstash.detailStatus.uptimeLabel', {
defaultMessage: 'Uptime'
}),
value: formatMetric(uptime, 'time_since'),
'data-test-subj': 'uptime'
@ -86,8 +86,8 @@ function DetailStatusUi({ stats, intl }) {
const metrics = [...firstMetrics];
if (queueType) {
metrics.push({
label: intl.formatMessage({
id: 'xpack.monitoring.logstash.detailStatus.queueTypeLabel', defaultMessage: 'Queue Type'
label: i18n.translate('xpack.monitoring.logstash.detailStatus.queueTypeLabel', {
defaultMessage: 'Queue Type'
}),
value: queueType,
'data-test-subj': 'queueType'
@ -102,5 +102,3 @@ function DetailStatusUi({ stats, intl }) {
/>
);
}
export const DetailStatus = injectI18n(DetailStatusUi);

11
x-pack/plugins/monitoring/public/components/logstash/listing/listing.js
View file

@ -10,10 +10,10 @@ import { EuiPage, EuiLink, EuiPageBody, EuiPageContent, EuiPanel, EuiSpacer } fr
import { formatPercentageUsage, formatNumber } from '../../../lib/format_number';
import { ClusterStatus } from '..//cluster_status';
import { EuiMonitoringTable } from '../../table';
import { injectI18n, FormattedMessage } from '@kbn/i18n/react';
import { FormattedMessage } from '@kbn/i18n/react';
import { i18n } from '@kbn/i18n';
class ListingUI extends PureComponent {
export class Listing extends PureComponent {
getColumns() {
const { kbnUrl, scope } = this.props.angular;
@ -111,7 +111,7 @@ class ListingUI extends PureComponent {
];
}
render() {
const { data, stats, sorting, pagination, onTableChange, intl } = this.props;
const { data, stats, sorting, pagination, onTableChange } = this.props;
const columns = this.getColumns();
const flattenedData = data.map(item => ({
...item,
@ -146,8 +146,7 @@ class ListingUI extends PureComponent {
search={{
box: {
incremental: true,
placeholder: intl.formatMessage({
id: 'xpack.monitoring.logstash.filterNodesPlaceholder',
placeholder: i18n.translate('xpack.monitoring.logstash.filterNodesPlaceholder', {
defaultMessage: 'Filter Nodes…'
})
},
@ -163,5 +162,3 @@ class ListingUI extends PureComponent {
);
}
}
export const Listing = injectI18n(ListingUI);

6
x-pack/plugins/monitoring/public/components/logstash/listing/listing.test.js
View file

@ -5,7 +5,7 @@
*/
import React from 'react';
import { shallowWithIntl } from 'test_utils/enzyme_helpers';
import { shallow } from 'enzyme';
import { Listing } from './listing';
const expectedData = [
@ -63,7 +63,7 @@ describe('Listing', () => {
}
};
const component = shallowWithIntl(<Listing.WrappedComponent {...props} />);
const component = shallow(<Listing {...props} />);
expect(component.find('EuiMonitoringTable')).toMatchSnapshot();
});
@ -82,7 +82,7 @@ describe('Listing', () => {
}
};
const component = shallowWithIntl(<Listing.WrappedComponent {...props} />);
const component = shallow(<Listing {...props} />);
expect(component.find('EuiMonitoringTable')).toMatchSnapshot();
});
});

11
x-pack/plugins/monitoring/public/components/logstash/pipeline_listing/pipeline_listing.js
View file

@ -12,10 +12,9 @@ import { formatMetric } from '../../../lib/format_number';
import { ClusterStatus } from '../cluster_status';
import { Sparkline } from 'plugins/monitoring/components/sparkline';
import { EuiMonitoringTable } from '../../table';
import { injectI18n } from '@kbn/i18n/react';
import { i18n } from '@kbn/i18n';
class PipelineListingUI extends Component {
export class PipelineListing extends Component {
tooltipXValueFormatter(xValue, dateFormat) {
return moment(xValue).format(dateFormat);
}
@ -139,8 +138,7 @@ class PipelineListingUI extends Component {
pagination,
onTableChange,
upgradeMessage,
className,
intl
className
} = this.props;
const columns = this.getColumns();
@ -169,8 +167,7 @@ class PipelineListingUI extends Component {
search={{
box: {
incremental: true,
placeholder: intl.formatMessage({
id: 'xpack.monitoring.logstash.filterPipelinesPlaceholder',
placeholder: i18n.translate('xpack.monitoring.logstash.filterPipelinesPlaceholder', {
defaultMessage: 'Filter Pipelines…'
})
},
@ -186,5 +183,3 @@ class PipelineListingUI extends Component {
);
}
}
export const PipelineListing = injectI18n(PipelineListingUI);

2
x-pack/plugins/monitoring/public/components/logstash/pipeline_viewer/views/__test__/__snapshots__/statement.test.js.snap generated
View file

@ -91,7 +91,7 @@ exports[`Statement component renders a PluginStatement component for plugin mode
<div
className="monPipelineViewer__spaceContainer"
/>
<InjectIntl(PluginStatementUi)
<PluginStatement
onShowVertexDetails={[MockFunction]}
statement={
PluginStatement {

10
x-pack/plugins/monitoring/public/components/logstash/pipeline_viewer/views/__test__/pipeline_viewer.test.js
View file

@ -6,7 +6,7 @@
import React from 'react';
import { PipelineViewer } from '../pipeline_viewer';
import { shallowWithIntl } from '../../../../../../../../test_utils/enzyme_helpers';
import { shallow } from 'enzyme';
describe('PipelineViewer component', () => {
let pipeline;
@ -43,20 +43,20 @@ describe('PipelineViewer component', () => {
},
};
component = <PipelineViewer.WrappedComponent pipeline={pipeline} setDetailVertexId={jest.fn()} />;
component = <PipelineViewer pipeline={pipeline} setDetailVertexId={jest.fn()} />;
});
it('passes expected props', () => {
const renderedComponent = shallowWithIntl(component);
const renderedComponent = shallow(component);
expect(renderedComponent).toMatchSnapshot();
});
it('renders DetailDrawer when selected vertex is not null', () => {
const vertex = { id: 'stdin' };
component = <PipelineViewer.WrappedComponent pipeline={pipeline} setDetailVertexId={jest.fn()} detailVertex={vertex} />;
component = <PipelineViewer pipeline={pipeline} setDetailVertexId={jest.fn()} detailVertex={vertex} />;
const renderedComponent = shallowWithIntl(component);
const renderedComponent = shallow(component);
expect(renderedComponent).toMatchSnapshot();
});

4
x-pack/plugins/monitoring/public/components/logstash/pipeline_viewer/views/__test__/plugin_statement.test.js
View file

@ -6,7 +6,7 @@
import React from 'react';
import { PluginStatement } from '../plugin_statement';
import { shallowWithIntl } from '../../../../../../../../test_utils/enzyme_helpers';
import { shallow } from 'enzyme';
import { EuiButtonEmpty, EuiBadge } from '@elastic/eui';
@ -49,7 +49,7 @@ describe('PluginStatement component', () => {
};
});
const render = props => shallowWithIntl(<PluginStatement.WrappedComponent {...props} />);
const render = props => shallow(<PluginStatement {...props} />);
it('renders input metrics and explicit id fields', () => {
expect(render(props)).toMatchSnapshot();

21
x-pack/plugins/monitoring/public/components/logstash/pipeline_viewer/views/pipeline_viewer.js
View file

@ -9,7 +9,7 @@ import PropTypes from 'prop-types';
import { DetailDrawer } from './detail_drawer';
import { Queue } from './queue';
import { StatementSection } from './statement_section';
import { injectI18n } from '@kbn/i18n/react';
import { i18n } from '@kbn/i18n';
import {
EuiSpacer,
EuiPage,
@ -17,7 +17,7 @@ import {
EuiPageBody,
} from '@elastic/eui';
class PipelineViewerUi extends React.Component {
export class PipelineViewer extends React.Component {
constructor() {
super();
this.state = {
@ -48,7 +48,6 @@ class PipelineViewerUi extends React.Component {
outputs,
queue
} = this.props.pipeline;
const { intl } = this.props;
return (
<EuiPage>
@ -56,7 +55,9 @@ class PipelineViewerUi extends React.Component {
<EuiPageContent verticalPosition="center" horizontalPosition="center" className="monPipelineViewer">
<StatementSection
iconType="logstashInput"
headingText={intl.formatMessage({ id: 'xpack.monitoring.logstash.pipelineViewer.inputsTitle', defaultMessage: 'Inputs' })}
headingText={i18n.translate('xpack.monitoring.logstash.pipelineViewer.inputsTitle', {
defaultMessage: 'Inputs'
})}
elements={inputs}
onShowVertexDetails={this.props.setDetailVertexId}
/>
@ -65,14 +66,18 @@ class PipelineViewerUi extends React.Component {
<EuiSpacer />
<StatementSection
iconType="logstashFilter"
headingText={intl.formatMessage({ id: 'xpack.monitoring.logstash.pipelineViewer.filtersTitle', defaultMessage: 'Filters' })}
headingText={i18n.translate('xpack.monitoring.logstash.pipelineViewer.filtersTitle', {
defaultMessage: 'Filters'
})}
elements={filters}
onShowVertexDetails={this.props.setDetailVertexId}
/>
<EuiSpacer />
<StatementSection
iconType="logstashOutput"
headingText={intl.formatMessage({ id: 'xpack.monitoring.logstash.pipelineViewer.outputsTitle', defaultMessage: 'Outputs' })}
headingText={i18n.translate('xpack.monitoring.logstash.pipelineViewer.outputsTitle', {
defaultMessage: 'Outputs'
})}
elements={outputs}
onShowVertexDetails={this.props.setDetailVertexId}
/>
@ -84,7 +89,7 @@ class PipelineViewerUi extends React.Component {
}
}
PipelineViewerUi.propTypes = {
PipelineViewer.propTypes = {
pipeline: PropTypes.shape({
inputs: PropTypes.array.isRequired,
filters: PropTypes.array.isRequired,
@ -92,5 +97,3 @@ PipelineViewerUi.propTypes = {
queue: PropTypes.object.isRequired,
}).isRequired
};
export const PipelineViewer = injectI18n(PipelineViewerUi);

13
x-pack/plugins/monitoring/public/components/logstash/pipeline_viewer/views/plugin_statement.js
View file

@ -14,7 +14,7 @@ import {
} from '@elastic/eui';
import { formatMetric } from '../../../../lib/format_number';
import { Metric } from './metric';
import { injectI18n } from '@kbn/i18n/react';
import { i18n } from '@kbn/i18n';
function getInputStatementMetrics({ latestEventsPerSecond }) {
return [
@ -65,10 +65,9 @@ function renderPluginStatementMetrics(pluginType, vertex) {
: getProcessorStatementMetrics(vertex);
}
function PluginStatementUi({
export function PluginStatement({
statement: { hasExplicitId, id, name, pluginType, vertex },
onShowVertexDetails,
intl,
}) {
const statementMetrics = renderPluginStatementMetrics(pluginType, vertex);
const onNameButtonClick = () => {
@ -101,8 +100,8 @@ function PluginStatementUi({
<EuiFlexItem grow={false}>
<EuiBadge
onClick={onNameButtonClick}
onClickAriaLabel={intl.formatMessage({
id: 'xpack.monitoring.logstash.pipelineStatement.viewDetailsAriaLabel', defaultMessage: 'View details'
onClickAriaLabel={i18n.translate('xpack.monitoring.logstash.pipelineStatement.viewDetailsAriaLabel', {
defaultMessage: 'View details'
})}
>
{id}
@ -120,7 +119,7 @@ function PluginStatementUi({
);
}
PluginStatementUi.propTypes = {
PluginStatement.propTypes = {
onShowVertexDetails: PropTypes.func.isRequired,
statement: PropTypes.shape({
hasExplicitId: PropTypes.bool.isRequired,
@ -134,5 +133,3 @@ PluginStatementUi.propTypes = {
}).isRequired,
}).isRequired,
};
export const PluginStatement = injectI18n(PluginStatementUi);

19
x-pack/plugins/monitoring/public/components/table/table.js
View file

@ -22,7 +22,8 @@ import { MonitoringTableToolBar } from './toolbar';
import { MonitoringTableNoData } from './no_data';
import { MonitoringTableFooter } from './footer';
import classNames from 'classnames';
import { FormattedMessage, injectI18n } from '@kbn/i18n/react';
import { FormattedMessage } from '@kbn/i18n/react';
import { i18n } from '@kbn/i18n';
/*
* State and data management for Monitoring Tables
@ -47,7 +48,7 @@ import { FormattedMessage, injectI18n } from '@kbn/i18n/react';
* }
* ];
*/
class MonitoringTableUI extends React.Component {
export class MonitoringTable extends React.Component {
constructor(props) {
super(props);
@ -123,10 +124,12 @@ class MonitoringTableUI extends React.Component {
break;
default:
throw new Error(
this.props.intl.formatMessage({
id: 'xpack.monitoring.table.unknownTableActionTypeErrorMessage',
defaultMessage: `Unknown table action type {action}! This shouldn't happen!` }, {
action
i18n.translate('xpack.monitoring.table.unknownTableActionTypeErrorMessage', {
defaultMessage: `Unknown table action type {action}! This shouldn't happen!`,
values: {
action
}
})
);
}
@ -464,12 +467,10 @@ const defaultGetNoDataMessage = filterText => {
return DEFAULT_NO_DATA_MESSAGE;
};
MonitoringTableUI.defaultProps = {
MonitoringTable.defaultProps = {
rows: [],
filterFields: [],
getNoDataMessage: defaultGetNoDataMessage,
alwaysShowPageControls: false,
rowsPerPage: 20
};
export const MonitoringTable = injectI18n(MonitoringTableUI);

19
x-pack/plugins/monitoring/public/directives/kibana/listing/index.js
View file

@ -23,7 +23,7 @@ import {
EuiLink,
} from '@elastic/eui';
import { i18n } from '@kbn/i18n';
import { FormattedMessage, injectI18n } from '@kbn/i18n/react';
import { FormattedMessage } from '@kbn/i18n/react';
import { I18nContext } from 'ui/i18n';
const filterFields = [ 'kibana.name', 'kibana.host', 'kibana.status', 'kibana.transport_address' ];
@ -73,7 +73,7 @@ const instanceRowFactory = (scope, kbnUrl) => {
});
};
return injectI18n(function KibanaRow(props) {
return function KibanaRow(props) {
return (
<KuiTableRow>
<KuiTableRowCell>
@ -91,13 +91,12 @@ const instanceRowFactory = (scope, kbnUrl) => {
<div
className="monTableCell__status"
title={
props.intl.formatMessage({
id: 'xpack.monitoring.kibana.listing.instanceStatusTitle',
defaultMessage: 'Instance status: {kibanaStatus}'
}, {
kibanaStatus: props.kibana.status
}
)
i18n.translate('xpack.monitoring.kibana.listing.instanceStatusTitle', {
defaultMessage: 'Instance status: {kibanaStatus}',
values: {
kibanaStatus: props.kibana.status
}
})
}
>
<KibanaStatusIcon status={props.kibana.status} availability={props.availability} />&nbsp;
@ -134,7 +133,7 @@ const instanceRowFactory = (scope, kbnUrl) => {
</KuiTableRowCell>
</KuiTableRow>
);
});
};
};
const uiModule = uiModules.get('monitoring/directives', []);