Feature/translate monitoring license (#24826)

* Translate monitoring -> license

* Translate monitoring -> page_loading

* Translate monitoring -> no_data

* Fix issues

* Update unit tests

* Fix eslint
This commit is contained in:
Nox911 2018-11-14 17:17:49 +03:00 committed by Maryia Lapata
parent 2b75815ee2
commit 8143d58ea4
28 changed files with 867 additions and 240 deletions

View file

@ -13,6 +13,7 @@ import {
EuiPanel
} from '@elastic/eui';
import { LicenseStatus, AddLicense } from 'plugins/xpack_main/components';
import { FormattedMessage } from '@kbn/i18n/react';
const LicenseUpdateInfoForPrimary = ({ isPrimaryCluster, uploadLicensePath }) => {
if (!isPrimaryCluster) {
@ -32,8 +33,14 @@ const LicenseUpdateInfoForRemote = ({ isPrimaryCluster }) => {
return (
<EuiPanel>
<p>
To update the license for this cluster, provide the license file through
the Elasticsearch API:
<FormattedMessage
id="xpack.monitoring.license.howToUpdateLicenseDescription"
defaultMessage="To update the license for this cluster, provide the license file through
the Elasticsearch {apiText}:"
values={{
apiText: 'API'
}}
/>
</p>
<EuiSpacer />
<EuiCodeBlock>

View file

@ -6,12 +6,12 @@
import React from 'react';
import { boomify, forbidden } from 'boom';
import { render } from 'enzyme';
import { renderWithIntl } from '../../../../../../test_utils/enzyme_helpers';
import { CheckerErrors } from '../checker_errors';
describe('CheckerErrors', () => {
test('should render nothing if errors is empty', () => {
const component = render(<CheckerErrors errors={[]} />);
const component = renderWithIntl(<CheckerErrors errors={[]} />);
expect(component).toMatchSnapshot();
});
@ -19,7 +19,7 @@ describe('CheckerErrors', () => {
const err1 = forbidden(new Error('no access for you'));
const err2 = boomify(new Error('bad thing happened'));
const errors = [err1, err2].map(err => err.output.payload);
const component = render(<CheckerErrors errors={errors} />);
const component = renderWithIntl(<CheckerErrors errors={errors} />);
expect(component).toMatchSnapshot();
});
});

View file

@ -5,14 +5,14 @@
*/
import React from 'react';
import { render } from 'enzyme';
import { renderWithIntl } from '../../../../../../test_utils/enzyme_helpers';
import { NoData } from '../';
const enabler = {};
describe('NoData', () => {
test('should show text next to the spinner while checking a setting', () => {
const component = render(
const component = renderWithIntl(
<NoData
isLoading={true}
checkMessage="checking something to test"
@ -23,7 +23,7 @@ describe('NoData', () => {
});
test('should show a default message if reason is unknown', () => {
const component = render(
const component = renderWithIntl(
<NoData
isLoading={false}
reason={{

View file

@ -6,16 +6,27 @@
import React, { Fragment } from 'react';
import { EuiTitle, EuiText, EuiTextColor } from '@elastic/eui';
import { FormattedMessage } from '@kbn/i18n/react';
export const ChangesNeeded = () => {
return (
<Fragment>
<EuiTitle size="l">
<h2>You need to make some adjustments</h2>
<h2>
<FormattedMessage
id="xpack.monitoring.noData.blurbs.changesNeededTitle"
defaultMessage="You need to make some adjustments"
/>
</h2>
</EuiTitle>
<EuiTextColor color="subdued">
<EuiText>
<p>To run monitoring please perform the following steps</p>
<p>
<FormattedMessage
id="xpack.monitoring.noData.blurbs.changesNeededDescription"
defaultMessage="To run monitoring please perform the following steps"
/>
</p>
</EuiText>
</EuiTextColor>
</Fragment>

View file

@ -6,16 +6,27 @@
import React, { Fragment } from 'react';
import { EuiTitle, EuiText, EuiTextColor } from '@elastic/eui';
import { FormattedMessage } from '@kbn/i18n/react';
export const LookingFor = () => {
return (
<Fragment>
<EuiTitle size="l">
<h2>We&apos;re looking for your monitoring data</h2>
<h2>
<FormattedMessage
id="xpack.monitoring.noData.blurbs.lookingForMonitoringDataTitle"
defaultMessage="We&apos;re looking for your monitoring data"
/>
</h2>
</EuiTitle>
<EuiTextColor color="subdued">
<EuiText>
<p>Monitoring provides insight to your hardware performance and load.</p>
<p>
<FormattedMessage
id="xpack.monitoring.noData.blurbs.lookingForMonitoringDataDescription"
defaultMessage="Monitoring provides insight to your hardware performance and load."
/>
</p>
</EuiText>
</EuiTextColor>
</Fragment>

View file

@ -6,17 +6,26 @@
import React, { Fragment } from 'react';
import { EuiTitle, EuiText, EuiTextColor } from '@elastic/eui';
import { FormattedMessage } from '@kbn/i18n/react';
export const WhatIs = () => {
return (
<Fragment>
<EuiTitle size="l">
<h2>Monitoring is currently off</h2>
<h2>
<FormattedMessage
id="xpack.monitoring.noData.blurbs.monitoringIsOffTitle"
defaultMessage="Monitoring is currently off"
/>
</h2>
</EuiTitle>
<EuiTextColor color="subdued">
<EuiText>
<p>
Monitoring provides insight to your hardware performance and load.
<FormattedMessage
id="xpack.monitoring.noData.blurbs.monitoringIsOffDescription"
defaultMessage="Monitoring provides insight to your hardware performance and load."
/>
</p>
</EuiText>
</EuiTextColor>

View file

@ -13,6 +13,7 @@ import {
EuiDescriptionListDescription,
EuiSpacer,
} from '@elastic/eui';
import { FormattedMessage } from '@kbn/i18n/react';
const ErrorList = ({ errors }) => {
return errors.map((error, errorIndex) => {
@ -44,9 +45,12 @@ export function CheckerErrors(props) {
className="eui-textLeft"
>
<p>
There were some errors encountered in trying to check Elasticsearch
settings. You need administrator rights to check the settings and, if
needed, to enable the monitoring collection setting.
<FormattedMessage
id="xpack.monitoring.noData.checkerErrors.checkEsSettingsErrorMessage"
defaultMessage="There were some errors encountered in trying to check Elasticsearch
settings. You need administrator rights to check the settings and, if
needed, to enable the monitoring collection setting."
/>
</p>
<EuiDescriptionList>

View file

@ -9,6 +9,88 @@ exports[`ExplainCollectionEnabled should explain about xpack.monitoring.collecti
"enableCollectionEnabled": [Function],
}
}
intl={
Object {
"defaultFormats": Object {
"date": Object {
"full": Object {
"day": "numeric",
"month": "long",
"weekday": "long",
"year": "numeric",
},
"long": Object {
"day": "numeric",
"month": "long",
"year": "numeric",
},
"medium": Object {
"day": "numeric",
"month": "short",
"year": "numeric",
},
"short": Object {
"day": "numeric",
"month": "numeric",
"year": "2-digit",
},
},
"number": Object {
"currency": Object {
"style": "currency",
},
"percent": Object {
"style": "percent",
},
},
"time": Object {
"full": Object {
"hour": "numeric",
"minute": "numeric",
"second": "numeric",
"timeZoneName": "short",
},
"long": Object {
"hour": "numeric",
"minute": "numeric",
"second": "numeric",
"timeZoneName": "short",
},
"medium": Object {
"hour": "numeric",
"minute": "numeric",
"second": "numeric",
},
"short": Object {
"hour": "numeric",
"minute": "numeric",
},
},
},
"defaultLocale": "en",
"formatDate": [Function],
"formatHTMLMessage": [Function],
"formatMessage": [Function],
"formatNumber": [Function],
"formatPlural": [Function],
"formatRelative": [Function],
"formatTime": [Function],
"formats": Object {},
"formatters": Object {
"getDateTimeFormat": [Function],
"getMessageFormat": [Function],
"getNumberFormat": [Function],
"getPluralFormat": [Function],
"getRelativeFormat": [Function],
},
"locale": "en",
"messages": Object {},
"now": [Function],
"onError": [Function],
"textComponent": Symbol(react.fragment),
"timeZone": null,
}
}
property="xpack.monitoring.collection.enabled"
>
<Component>
@ -19,7 +101,13 @@ exports[`ExplainCollectionEnabled should explain about xpack.monitoring.collecti
<h2
className="euiTitle euiTitle--large"
>
Monitoring is currently off
<FormattedMessage
defaultMessage="Monitoring is currently off"
id="xpack.monitoring.noData.blurbs.monitoringIsOffTitle"
values={Object {}}
>
Monitoring is currently off
</FormattedMessage>
</h2>
</EuiTitle>
<EuiTextColor
@ -37,7 +125,13 @@ exports[`ExplainCollectionEnabled should explain about xpack.monitoring.collecti
className="euiText euiText--medium"
>
<p>
Monitoring provides insight to your hardware performance and load.
<FormattedMessage
defaultMessage="Monitoring provides insight to your hardware performance and load."
id="xpack.monitoring.noData.blurbs.monitoringIsOffDescription"
values={Object {}}
>
Monitoring provides insight to your hardware performance and load.
</FormattedMessage>
</p>
</div>
</EuiText>
@ -60,52 +154,72 @@ exports[`ExplainCollectionEnabled should explain about xpack.monitoring.collecti
className="euiText euiText--medium"
>
<p>
We checked the
cluster
settings and found that
<EuiCode>
<EuiCodeBlockImpl
fontSize="s"
inline={true}
paddingSize="l"
transparentBackground={false}
>
<span
className="euiCodeBlock euiCodeBlock--fontSmall euiCodeBlock--paddingLarge euiCodeBlock--inline"
style={Object {}}
>
<code
className="euiCodeBlock__code"
>
xpack.monitoring.collection.enabled
</code>
</span>
</EuiCodeBlockImpl>
</EuiCode>
is set to
<EuiCode>
<EuiCodeBlockImpl
fontSize="s"
inline={true}
paddingSize="l"
transparentBackground={false}
>
<span
className="euiCodeBlock euiCodeBlock--fontSmall euiCodeBlock--paddingLarge euiCodeBlock--inline"
style={Object {}}
>
<code
className="euiCodeBlock__code"
>
<FormattedMessage
defaultMessage="We checked the {context} settings and found that {property} is set to {data}."
id="xpack.monitoring.noData.explanations.collectionEnabledDescription"
values={
Object {
"context": "cluster",
"data": <EuiCode>
-1
</code>
</span>
</EuiCodeBlockImpl>
</EuiCode>
.
</EuiCode>,
"property": <EuiCode>
xpack.monitoring.collection.enabled
</EuiCode>,
}
}
>
We checked the cluster settings and found that
<EuiCode>
<EuiCodeBlockImpl
fontSize="s"
inline={true}
paddingSize="l"
transparentBackground={false}
>
<span
className="euiCodeBlock euiCodeBlock--fontSmall euiCodeBlock--paddingLarge euiCodeBlock--inline"
style={Object {}}
>
<code
className="euiCodeBlock__code"
>
xpack.monitoring.collection.enabled
</code>
</span>
</EuiCodeBlockImpl>
</EuiCode>
is set to
<EuiCode>
<EuiCodeBlockImpl
fontSize="s"
inline={true}
paddingSize="l"
transparentBackground={false}
>
<span
className="euiCodeBlock euiCodeBlock--fontSmall euiCodeBlock--paddingLarge euiCodeBlock--inline"
style={Object {}}
>
<code
className="euiCodeBlock__code"
>
-1
</code>
</span>
</EuiCodeBlockImpl>
</EuiCode>
.
</FormattedMessage>
</p>
<p>
Would you like to turn it on?
<FormattedMessage
defaultMessage="Would you like to turn it on?"
id="xpack.monitoring.noData.explanations.collectionEnabled.turnItOnDescription"
values={Object {}}
>
Would you like to turn it on?
</FormattedMessage>
</p>
</div>
</EuiText>
@ -155,7 +269,13 @@ exports[`ExplainCollectionEnabled should explain about xpack.monitoring.collecti
<span
className="euiButton__text"
>
Turn on monitoring
<FormattedMessage
defaultMessage="Turn on monitoring"
id="xpack.monitoring.noData.explanations.collectionEnabled.turnOnMonitoringButtonLabel"
values={Object {}}
>
Turn on monitoring
</FormattedMessage>
</span>
</span>
</button>

View file

@ -6,7 +6,7 @@
import React from 'react';
import sinon from 'sinon';
import { mount } from 'enzyme';
import { mountWithIntl } from '../../../../../../../../test_utils/enzyme_helpers';
import { ExplainCollectionEnabled } from '../collection_enabled';
import { findTestSubject } from '@elastic/eui/lib/test';
@ -27,12 +27,12 @@ describe('ExplainCollectionEnabled', () => {
});
test('should explain about xpack.monitoring.collection.enabled setting', () => {
const rendered = mount(component);
const rendered = mountWithIntl(component);
expect(rendered).toMatchSnapshot();
});
test('should have a button that triggers ajax action', () => {
const rendered = mount(component);
const rendered = mountWithIntl(component);
const actionButton = findTestSubject(rendered, 'enableCollectionEnabled');
actionButton.simulate('click');
expect(enabler.enableCollectionEnabled.calledOnce).toBe(true);

View file

@ -18,6 +18,7 @@ import {
EuiTitle
} from '@elastic/eui';
import { WhatIs } from '../../blurbs';
import { FormattedMessage } from '@kbn/i18n/react';
export class ExplainCollectionEnabled extends React.Component {
constructor(props) {
@ -59,11 +60,22 @@ export class ExplainCollectionEnabled extends React.Component {
<EuiHorizontalRule size="half" />
<EuiText>
<p>
We checked the {context} settings and found that <EuiCode>{property}</EuiCode>
is set to <EuiCode>{data}</EuiCode>.
<FormattedMessage
id="xpack.monitoring.noData.explanations.collectionEnabledDescription"
defaultMessage="We checked the {context} settings and found that {property}
is set to {data}."
values={{
context,
property: (<EuiCode>{property}</EuiCode>),
data: (<EuiCode>{data}</EuiCode>)
}}
/>
</p>
<p>
Would you like to turn it on?
<FormattedMessage
id="xpack.monitoring.noData.explanations.collectionEnabled.turnItOnDescription"
defaultMessage="Would you like to turn it on?"
/>
</p>
</EuiText>
<EuiSpacer />
@ -80,7 +92,10 @@ export class ExplainCollectionEnabled extends React.Component {
data-test-subj="enableCollectionEnabled"
isLoading={isCollectionEnabledUpdating}
>
Turn on monitoring
<FormattedMessage
id="xpack.monitoring.noData.explanations.collectionEnabled.turnOnMonitoringButtonLabel"
defaultMessage="Turn on monitoring"
/>
</EuiButton>
</EuiFlexItem>
</EuiFlexGroup>
@ -89,20 +104,33 @@ export class ExplainCollectionEnabled extends React.Component {
const stillWaiting = this.state.waitedTooLong ? (
<p>
<a href="#/">Still waiting?</a>
<a href="#/">
<FormattedMessage
id="xpack.monitoring.noData.explanations.collectionEnabled.stillWaitingLinkText"
defaultMessage="Still waiting?"
/>
</a>
</p>
) : null;
const renderSuccess = () => (
<Fragment>
<EuiTitle size="l" data-test-subj="monitoringCollectionEnabledMessage">
<h2>Success! Getting your monitoring data.</h2>
<h2>
<FormattedMessage
id="xpack.monitoring.noData.explanations.collectionEnabled.monitoringTurnedOnTitle"
defaultMessage="Success! Getting your monitoring data."
/>
</h2>
</EuiTitle>
<EuiHorizontalRule size="half" />
<EuiText>
<p>
When the data is in your cluster, your monitoring dashboard will
show up here. This might take a few seconds.
<FormattedMessage
id="xpack.monitoring.noData.explanations.collectionEnabled.monitoringTurnedOnDescription"
defaultMessage="When the data is in your cluster, your monitoring dashboard will
show up here. This might take a few seconds."
/>
</p>
</EuiText>
<EuiSpacer />

View file

@ -9,6 +9,88 @@ exports[`ExplainCollectionInterval collection interval setting updates should sh
"enableCollectionInterval": [Function],
}
}
intl={
Object {
"defaultFormats": Object {
"date": Object {
"full": Object {
"day": "numeric",
"month": "long",
"weekday": "long",
"year": "numeric",
},
"long": Object {
"day": "numeric",
"month": "long",
"year": "numeric",
},
"medium": Object {
"day": "numeric",
"month": "short",
"year": "numeric",
},
"short": Object {
"day": "numeric",
"month": "numeric",
"year": "2-digit",
},
},
"number": Object {
"currency": Object {
"style": "currency",
},
"percent": Object {
"style": "percent",
},
},
"time": Object {
"full": Object {
"hour": "numeric",
"minute": "numeric",
"second": "numeric",
"timeZoneName": "short",
},
"long": Object {
"hour": "numeric",
"minute": "numeric",
"second": "numeric",
"timeZoneName": "short",
},
"medium": Object {
"hour": "numeric",
"minute": "numeric",
"second": "numeric",
},
"short": Object {
"hour": "numeric",
"minute": "numeric",
},
},
},
"defaultLocale": "en",
"formatDate": [Function],
"formatHTMLMessage": [Function],
"formatMessage": [Function],
"formatNumber": [Function],
"formatPlural": [Function],
"formatRelative": [Function],
"formatTime": [Function],
"formats": Object {},
"formatters": Object {
"getDateTimeFormat": [Function],
"getMessageFormat": [Function],
"getNumberFormat": [Function],
"getPluralFormat": [Function],
"getRelativeFormat": [Function],
},
"locale": "en",
"messages": Object {},
"now": [Function],
"onError": [Function],
"textComponent": Symbol(react.fragment),
"timeZone": null,
}
}
isCollectionIntervalUpdated={true}
isCollectionIntervalUpdating={false}
property="xpack.monitoring.collection.interval"
@ -20,7 +102,13 @@ exports[`ExplainCollectionInterval collection interval setting updates should sh
<h2
className="euiTitle euiTitle--large"
>
Success! Wait a moment please.
<FormattedMessage
defaultMessage="Success! Wait a moment please."
id="xpack.monitoring.noData.explanations.collectionInterval.monitoringTurnedOnTitle"
values={Object {}}
>
Success! Wait a moment please.
</FormattedMessage>
</h2>
</EuiTitle>
<EuiHorizontalRule
@ -39,7 +127,13 @@ exports[`ExplainCollectionInterval collection interval setting updates should sh
className="euiText euiText--medium"
>
<p>
As soon as monitoring data appears in your cluster the page will automatically refresh with your monitoring dashboard. This only takes only a few seconds.
<FormattedMessage
defaultMessage="As soon as monitoring data appears in your cluster the page will automatically refresh with your monitoring dashboard. This only takes only a few seconds."
id="xpack.monitoring.noData.explanations.collectionInterval.monitoringTurnedOnDescription"
values={Object {}}
>
As soon as monitoring data appears in your cluster the page will automatically refresh with your monitoring dashboard. This only takes only a few seconds.
</FormattedMessage>
</p>
</div>
</EuiText>
@ -69,6 +163,88 @@ exports[`ExplainCollectionInterval collection interval setting updates should sh
"enableCollectionInterval": [Function],
}
}
intl={
Object {
"defaultFormats": Object {
"date": Object {
"full": Object {
"day": "numeric",
"month": "long",
"weekday": "long",
"year": "numeric",
},
"long": Object {
"day": "numeric",
"month": "long",
"year": "numeric",
},
"medium": Object {
"day": "numeric",
"month": "short",
"year": "numeric",
},
"short": Object {
"day": "numeric",
"month": "numeric",
"year": "2-digit",
},
},
"number": Object {
"currency": Object {
"style": "currency",
},
"percent": Object {
"style": "percent",
},
},
"time": Object {
"full": Object {
"hour": "numeric",
"minute": "numeric",
"second": "numeric",
"timeZoneName": "short",
},
"long": Object {
"hour": "numeric",
"minute": "numeric",
"second": "numeric",
"timeZoneName": "short",
},
"medium": Object {
"hour": "numeric",
"minute": "numeric",
"second": "numeric",
},
"short": Object {
"hour": "numeric",
"minute": "numeric",
},
},
},
"defaultLocale": "en",
"formatDate": [Function],
"formatHTMLMessage": [Function],
"formatMessage": [Function],
"formatNumber": [Function],
"formatPlural": [Function],
"formatRelative": [Function],
"formatTime": [Function],
"formats": Object {},
"formatters": Object {
"getDateTimeFormat": [Function],
"getMessageFormat": [Function],
"getNumberFormat": [Function],
"getPluralFormat": [Function],
"getRelativeFormat": [Function],
},
"locale": "en",
"messages": Object {},
"now": [Function],
"onError": [Function],
"textComponent": Symbol(react.fragment),
"timeZone": null,
}
}
isCollectionIntervalUpdated={false}
isCollectionIntervalUpdating={true}
property="xpack.monitoring.collection.interval"
@ -81,7 +257,13 @@ exports[`ExplainCollectionInterval collection interval setting updates should sh
<h2
className="euiTitle euiTitle--large"
>
Monitoring is currently off
<FormattedMessage
defaultMessage="Monitoring is currently off"
id="xpack.monitoring.noData.blurbs.monitoringIsOffTitle"
values={Object {}}
>
Monitoring is currently off
</FormattedMessage>
</h2>
</EuiTitle>
<EuiTextColor
@ -99,7 +281,13 @@ exports[`ExplainCollectionInterval collection interval setting updates should sh
className="euiText euiText--medium"
>
<p>
Monitoring provides insight to your hardware performance and load.
<FormattedMessage
defaultMessage="Monitoring provides insight to your hardware performance and load."
id="xpack.monitoring.noData.blurbs.monitoringIsOffDescription"
values={Object {}}
>
Monitoring provides insight to your hardware performance and load.
</FormattedMessage>
</p>
</div>
</EuiText>
@ -122,55 +310,81 @@ exports[`ExplainCollectionInterval collection interval setting updates should sh
className="euiText euiText--medium"
>
<p>
We checked the
cluster
settings and found that
<EuiCode>
<EuiCodeBlockImpl
fontSize="s"
inline={true}
paddingSize="l"
transparentBackground={false}
>
<span
className="euiCodeBlock euiCodeBlock--fontSmall euiCodeBlock--paddingLarge euiCodeBlock--inline"
style={Object {}}
>
<code
className="euiCodeBlock__code"
>
xpack.monitoring.collection.interval
</code>
</span>
</EuiCodeBlockImpl>
</EuiCode>
is set to
<EuiCode>
<EuiCodeBlockImpl
fontSize="s"
inline={true}
paddingSize="l"
transparentBackground={false}
>
<span
className="euiCodeBlock euiCodeBlock--fontSmall euiCodeBlock--paddingLarge euiCodeBlock--inline"
style={Object {}}
>
<code
className="euiCodeBlock__code"
>
<FormattedMessage
defaultMessage="We checked the {context} settings and found that {property} is set to {data}."
id="xpack.monitoring.noData.explanations.collectionIntervalDescription"
values={
Object {
"context": "cluster",
"data": <EuiCode>
-1
</code>
</span>
</EuiCodeBlockImpl>
</EuiCode>
.
</EuiCode>,
"property": <EuiCode>
xpack.monitoring.collection.interval
</EuiCode>,
}
}
>
We checked the cluster settings and found that
<EuiCode>
<EuiCodeBlockImpl
fontSize="s"
inline={true}
paddingSize="l"
transparentBackground={false}
>
<span
className="euiCodeBlock euiCodeBlock--fontSmall euiCodeBlock--paddingLarge euiCodeBlock--inline"
style={Object {}}
>
<code
className="euiCodeBlock__code"
>
xpack.monitoring.collection.interval
</code>
</span>
</EuiCodeBlockImpl>
</EuiCode>
is set to
<EuiCode>
<EuiCodeBlockImpl
fontSize="s"
inline={true}
paddingSize="l"
transparentBackground={false}
>
<span
className="euiCodeBlock euiCodeBlock--fontSmall euiCodeBlock--paddingLarge euiCodeBlock--inline"
style={Object {}}
>
<code
className="euiCodeBlock__code"
>
-1
</code>
</span>
</EuiCodeBlockImpl>
</EuiCode>
.
</FormattedMessage>
</p>
<p>
The collection interval setting needs to be a positive integer (10s is recommended) in order for the collection agents to be active.
<FormattedMessage
defaultMessage="The collection interval setting needs to be a positive integer (10s is recommended) in order for the collection agents to be active."
id="xpack.monitoring.noData.explanations.collectionInterval.wrongIntervalValueDescription"
values={Object {}}
>
The collection interval setting needs to be a positive integer (10s is recommended) in order for the collection agents to be active.
</FormattedMessage>
</p>
<p>
Would you like us to change it and enable monitoring?
<FormattedMessage
defaultMessage="Would you like us to change it and enable monitoring?"
id="xpack.monitoring.noData.explanations.collectionInterval.changeIntervalDescription"
values={Object {}}
>
Would you like us to change it and enable monitoring?
</FormattedMessage>
</p>
</div>
</EuiText>
@ -230,7 +444,13 @@ exports[`ExplainCollectionInterval collection interval setting updates should sh
<span
className="euiButton__text"
>
Turn on monitoring
<FormattedMessage
defaultMessage="Turn on monitoring"
id="xpack.monitoring.noData.explanations.collectionInterval.turnOnMonitoringButtonLabel"
values={Object {}}
>
Turn on monitoring
</FormattedMessage>
</span>
</span>
</button>
@ -251,6 +471,88 @@ exports[`ExplainCollectionInterval should explain about xpack.monitoring.collect
"enableCollectionInterval": [Function],
}
}
intl={
Object {
"defaultFormats": Object {
"date": Object {
"full": Object {
"day": "numeric",
"month": "long",
"weekday": "long",
"year": "numeric",
},
"long": Object {
"day": "numeric",
"month": "long",
"year": "numeric",
},
"medium": Object {
"day": "numeric",
"month": "short",
"year": "numeric",
},
"short": Object {
"day": "numeric",
"month": "numeric",
"year": "2-digit",
},
},
"number": Object {
"currency": Object {
"style": "currency",
},
"percent": Object {
"style": "percent",
},
},
"time": Object {
"full": Object {
"hour": "numeric",
"minute": "numeric",
"second": "numeric",
"timeZoneName": "short",
},
"long": Object {
"hour": "numeric",
"minute": "numeric",
"second": "numeric",
"timeZoneName": "short",
},
"medium": Object {
"hour": "numeric",
"minute": "numeric",
"second": "numeric",
},
"short": Object {
"hour": "numeric",
"minute": "numeric",
},
},
},
"defaultLocale": "en",
"formatDate": [Function],
"formatHTMLMessage": [Function],
"formatMessage": [Function],
"formatNumber": [Function],
"formatPlural": [Function],
"formatRelative": [Function],
"formatTime": [Function],
"formats": Object {},
"formatters": Object {
"getDateTimeFormat": [Function],
"getMessageFormat": [Function],
"getNumberFormat": [Function],
"getPluralFormat": [Function],
"getRelativeFormat": [Function],
},
"locale": "en",
"messages": Object {},
"now": [Function],
"onError": [Function],
"textComponent": Symbol(react.fragment),
"timeZone": null,
}
}
isCollectionIntervalUpdated={false}
isCollectionIntervalUpdating={false}
property="xpack.monitoring.collection.interval"
@ -263,7 +565,13 @@ exports[`ExplainCollectionInterval should explain about xpack.monitoring.collect
<h2
className="euiTitle euiTitle--large"
>
Monitoring is currently off
<FormattedMessage
defaultMessage="Monitoring is currently off"
id="xpack.monitoring.noData.blurbs.monitoringIsOffTitle"
values={Object {}}
>
Monitoring is currently off
</FormattedMessage>
</h2>
</EuiTitle>
<EuiTextColor
@ -281,7 +589,13 @@ exports[`ExplainCollectionInterval should explain about xpack.monitoring.collect
className="euiText euiText--medium"
>
<p>
Monitoring provides insight to your hardware performance and load.
<FormattedMessage
defaultMessage="Monitoring provides insight to your hardware performance and load."
id="xpack.monitoring.noData.blurbs.monitoringIsOffDescription"
values={Object {}}
>
Monitoring provides insight to your hardware performance and load.
</FormattedMessage>
</p>
</div>
</EuiText>
@ -304,55 +618,81 @@ exports[`ExplainCollectionInterval should explain about xpack.monitoring.collect
className="euiText euiText--medium"
>
<p>
We checked the
cluster
settings and found that
<EuiCode>
<EuiCodeBlockImpl
fontSize="s"
inline={true}
paddingSize="l"
transparentBackground={false}
>
<span
className="euiCodeBlock euiCodeBlock--fontSmall euiCodeBlock--paddingLarge euiCodeBlock--inline"
style={Object {}}
>
<code
className="euiCodeBlock__code"
>
xpack.monitoring.collection.interval
</code>
</span>
</EuiCodeBlockImpl>
</EuiCode>
is set to
<EuiCode>
<EuiCodeBlockImpl
fontSize="s"
inline={true}
paddingSize="l"
transparentBackground={false}
>
<span
className="euiCodeBlock euiCodeBlock--fontSmall euiCodeBlock--paddingLarge euiCodeBlock--inline"
style={Object {}}
>
<code
className="euiCodeBlock__code"
>
<FormattedMessage
defaultMessage="We checked the {context} settings and found that {property} is set to {data}."
id="xpack.monitoring.noData.explanations.collectionIntervalDescription"
values={
Object {
"context": "cluster",
"data": <EuiCode>
-1
</code>
</span>
</EuiCodeBlockImpl>
</EuiCode>
.
</EuiCode>,
"property": <EuiCode>
xpack.monitoring.collection.interval
</EuiCode>,
}
}
>
We checked the cluster settings and found that
<EuiCode>
<EuiCodeBlockImpl
fontSize="s"
inline={true}
paddingSize="l"
transparentBackground={false}
>
<span
className="euiCodeBlock euiCodeBlock--fontSmall euiCodeBlock--paddingLarge euiCodeBlock--inline"
style={Object {}}
>
<code
className="euiCodeBlock__code"
>
xpack.monitoring.collection.interval
</code>
</span>
</EuiCodeBlockImpl>
</EuiCode>
is set to
<EuiCode>
<EuiCodeBlockImpl
fontSize="s"
inline={true}
paddingSize="l"
transparentBackground={false}
>
<span
className="euiCodeBlock euiCodeBlock--fontSmall euiCodeBlock--paddingLarge euiCodeBlock--inline"
style={Object {}}
>
<code
className="euiCodeBlock__code"
>
-1
</code>
</span>
</EuiCodeBlockImpl>
</EuiCode>
.
</FormattedMessage>
</p>
<p>
The collection interval setting needs to be a positive integer (10s is recommended) in order for the collection agents to be active.
<FormattedMessage
defaultMessage="The collection interval setting needs to be a positive integer (10s is recommended) in order for the collection agents to be active."
id="xpack.monitoring.noData.explanations.collectionInterval.wrongIntervalValueDescription"
values={Object {}}
>
The collection interval setting needs to be a positive integer (10s is recommended) in order for the collection agents to be active.
</FormattedMessage>
</p>
<p>
Would you like us to change it and enable monitoring?
<FormattedMessage
defaultMessage="Would you like us to change it and enable monitoring?"
id="xpack.monitoring.noData.explanations.collectionInterval.changeIntervalDescription"
values={Object {}}
>
Would you like us to change it and enable monitoring?
</FormattedMessage>
</p>
</div>
</EuiText>
@ -403,7 +743,13 @@ exports[`ExplainCollectionInterval should explain about xpack.monitoring.collect
<span
className="euiButton__text"
>
Turn on monitoring
<FormattedMessage
defaultMessage="Turn on monitoring"
id="xpack.monitoring.noData.explanations.collectionInterval.turnOnMonitoringButtonLabel"
values={Object {}}
>
Turn on monitoring
</FormattedMessage>
</span>
</span>
</button>

View file

@ -6,7 +6,7 @@
import React from 'react';
import sinon from 'sinon';
import { mount } from 'enzyme';
import { mountWithIntl } from '../../../../../../../../test_utils/enzyme_helpers';
import { ExplainCollectionInterval } from '../collection_interval';
import { findTestSubject } from '@elastic/eui/lib/test';
@ -28,7 +28,7 @@ describe('ExplainCollectionInterval', () => {
enabler={enabler}
/>
);
const rendered = mount(component);
const rendered = mountWithIntl(component);
expect(rendered).toMatchSnapshot();
});
@ -43,7 +43,7 @@ describe('ExplainCollectionInterval', () => {
enabler={enabler}
/>
);
const rendered = mount(component);
const rendered = mountWithIntl(component);
const actionButton = findTestSubject(rendered, 'enableCollectionInterval');
actionButton.simulate('click');
expect(enabler.enableCollectionInterval.calledOnce).toBe(true);
@ -61,7 +61,7 @@ describe('ExplainCollectionInterval', () => {
enabler={enabler}
/>
);
const rendered = mount(component);
const rendered = mountWithIntl(component);
expect(rendered).toMatchSnapshot();
});
@ -76,7 +76,7 @@ describe('ExplainCollectionInterval', () => {
enabler={enabler}
/>
);
const rendered = mount(component);
const rendered = mountWithIntl(component);
expect(rendered).toMatchSnapshot();
});
});

View file

@ -18,6 +18,7 @@ import {
EuiTitle
} from '@elastic/eui';
import { WhatIs } from '../../blurbs';
import { FormattedMessage } from '@kbn/i18n/react';
export class ExplainCollectionInterval extends React.Component {
constructor(props) {
@ -45,15 +46,29 @@ export class ExplainCollectionInterval extends React.Component {
<EuiHorizontalRule size="half" />
<EuiText>
<p>
We checked the {context} settings and found that <EuiCode>{property}</EuiCode>
is set to <EuiCode>{data}</EuiCode>.
<FormattedMessage
id="xpack.monitoring.noData.explanations.collectionIntervalDescription"
defaultMessage="We checked the {context} settings and found that {property}
is set to {data}."
values={{
context,
property: (<EuiCode>{property}</EuiCode>),
data: (<EuiCode>{data}</EuiCode>)
}}
/>
</p>
<p>
The collection interval setting needs to be a positive integer
(10s is recommended) in order for the collection agents to be active.
<FormattedMessage
id="xpack.monitoring.noData.explanations.collectionInterval.wrongIntervalValueDescription"
defaultMessage="The collection interval setting needs to be a positive integer
(10s is recommended) in order for the collection agents to be active."
/>
</p>
<p>
Would you like us to change it and enable monitoring?
<FormattedMessage
id="xpack.monitoring.noData.explanations.collectionInterval.changeIntervalDescription"
defaultMessage="Would you like us to change it and enable monitoring?"
/>
</p>
</EuiText>
<EuiSpacer />
@ -70,7 +85,10 @@ export class ExplainCollectionInterval extends React.Component {
data-test-subj="enableCollectionInterval"
isLoading={isCollectionIntervalUpdating}
>
Turn on monitoring
<FormattedMessage
id="xpack.monitoring.noData.explanations.collectionInterval.turnOnMonitoringButtonLabel"
defaultMessage="Turn on monitoring"
/>
</EuiButton>
</EuiFlexItem>
</EuiFlexGroup>
@ -79,14 +97,22 @@ export class ExplainCollectionInterval extends React.Component {
const renderSuccess = () => (
<Fragment>
<EuiTitle size="l">
<h2>Success! Wait a moment please.</h2>
<h2>
<FormattedMessage
id="xpack.monitoring.noData.explanations.collectionInterval.monitoringTurnedOnTitle"
defaultMessage="Success! Wait a moment please."
/>
</h2>
</EuiTitle>
<EuiHorizontalRule size="half" />
<EuiText>
<p>
As soon as monitoring data appears in your
cluster the page will automatically refresh with your monitoring
dashboard. This only takes only a few seconds.
<FormattedMessage
id="xpack.monitoring.noData.explanations.collectionInterval.monitoringTurnedOnDescription"
defaultMessage="As soon as monitoring data appears in your
cluster the page will automatically refresh with your monitoring
dashboard. This only takes only a few seconds."
/>
</p>
</EuiText>
<EuiSpacer />

View file

@ -5,12 +5,12 @@
*/
import React from 'react';
import { render } from 'enzyme';
import { renderWithIntl } from '../../../../../../../../test_utils/enzyme_helpers';
import { ExplainExporters } from '../exporters';
describe('ExplainExporters', () => {
test('should explain about xpack.monitoring.exporters setting', () => {
const component = render(
const component = renderWithIntl(
<ExplainExporters
property="xpack.monitoring.exporters"
data={'myMonitoringClusterExporter1'}

View file

@ -12,6 +12,7 @@ import {
EuiHorizontalRule,
} from '@elastic/eui';
import { ChangesNeeded } from '../../blurbs';
import { FormattedMessage } from '@kbn/i18n/react';
export function ExplainExporters({ context, property, data }) {
return (
@ -20,28 +21,46 @@ export function ExplainExporters({ context, property, data }) {
<EuiHorizontalRule size="half" />
<EuiText className="eui-textLeft">
<p>
We checked the <EuiCode>{context}</EuiCode> settings for{' '}
<EuiCode>{property}</EuiCode>, and found the reason:{' '}
<EuiCode>{data}</EuiCode>.
<FormattedMessage
id="xpack.monitoring.noData.explanations.exportersDescription"
defaultMessage="We checked the {context} settings for
{property}, and found the reason: {data}."
values={{
context: (<EuiCode>{context}</EuiCode>),
property: (<EuiCode>{property}</EuiCode>),
data: (<EuiCode>{data}</EuiCode>)
}}
/>
</p>
<p>
Using monitoring exporters ship the monitoring data to a remote
monitoring cluster is highly recommended as it keeps the integrity of
the monitoring data safe no matter what the state of the production
cluster. However, as this instance of Kibana could not find any
monitoring data, there seems to be a problem with the{' '}
<EuiCode>{property}</EuiCode> configuration, or the{' '}
<EuiCode>xpack.monitoring.elasticsearch</EuiCode> settings in{' '}
<EuiCode>kibana.yml</EuiCode>.
<FormattedMessage
id="xpack.monitoring.noData.explanations.exporters.problemWithConfigDescription"
defaultMessage="Using monitoring exporters ship the monitoring data to a remote
monitoring cluster is highly recommended as it keeps the integrity of
the monitoring data safe no matter what the state of the production
cluster. However, as this instance of Kibana could not find any
monitoring data, there seems to be a problem with the {property} configuration,
or the {monitoringEs} settings in {kibanaConfig}."
values={{
property: (<EuiCode>{property}</EuiCode>),
monitoringEs: (<EuiCode>xpack.monitoring.elasticsearch</EuiCode>),
kibanaConfig: (<EuiCode>kibana.yml</EuiCode>)
}}
/>
</p>
<p>
Check that the intended exporters are enabled for sending statistics to
the monitoring cluster, and that the monitoring cluster host matches the{' '}
<EuiCode>xpack.monitoring.elasticsearch</EuiCode> setting in{' '}
<EuiCode>kibana.yml</EuiCode> to see monitoring data in this instance of
Kibana.
<FormattedMessage
id="xpack.monitoring.noData.explanations.exporters.checkConfigDescription"
defaultMessage="Check that the intended exporters are enabled for sending statistics to
the monitoring cluster, and that the monitoring cluster host matches the {monitoringEs}
setting in {kibanaConfig} to see monitoring data in this instance of Kibana."
values={{
monitoringEs: (<EuiCode>xpack.monitoring.elasticsearch</EuiCode>),
kibanaConfig: (<EuiCode>kibana.yml</EuiCode>)
}}
/>
</p>
</EuiText>
</Fragment>

View file

@ -5,12 +5,12 @@
*/
import React from 'react';
import { render } from 'enzyme';
import { renderWithIntl } from '../../../../../../../../test_utils/enzyme_helpers';
import { ExplainPluginEnabled } from '../plugin_enabled';
describe('ExplainPluginEnabled', () => {
test('should explain about xpack.monitoring.enabled setting', () => {
const component = render(
const component = renderWithIntl(
<ExplainPluginEnabled
property="xpack.monitoring.enabled"
data="false"

View file

@ -12,6 +12,7 @@ import {
EuiHorizontalRule,
} from '@elastic/eui';
import { ChangesNeeded } from '../../blurbs';
import { FormattedMessage } from '@kbn/i18n/react';
export function ExplainPluginEnabled({ context, property, data }) {
return (
@ -20,10 +21,19 @@ export function ExplainPluginEnabled({ context, property, data }) {
<EuiHorizontalRule size="half" />
<EuiText>
<p>
We checked the {context} settings and found that <EuiCode>{property}</EuiCode>{' '}
is set to <EuiCode>{data}</EuiCode> set, which disables monitoring.
Removing the <EuiCode>xpack.monitoring.enabled: false</EuiCode> setting
from your configuration will put the default into effect and enable Monitoring.
<FormattedMessage
id="xpack.monitoring.noData.explanations.pluginEnabledDescription"
defaultMessage="We checked the {context} settings and found that {property}
is set to {data} set, which disables monitoring.
Removing the {monitoringEnableFalse} setting
from your configuration will put the default into effect and enable Monitoring."
values={{
context,
property: (<EuiCode>{property}</EuiCode>),
data: (<EuiCode>{data}</EuiCode>),
monitoringEnableFalse: (<EuiCode>xpack.monitoring.enabled: false</EuiCode>)
}}
/>
</p>
</EuiText>
</Fragment>

View file

@ -35,7 +35,7 @@ Array [
xpack.monitoring.collection.interval
</code>
</span>
is set to
is set to
<span
class="euiCodeBlock euiCodeBlock--fontSmall euiCodeBlock--paddingLarge euiCodeBlock--inline"
>

View file

@ -5,14 +5,14 @@
*/
import React from 'react';
import { render } from 'enzyme';
import { renderWithIntl } from '../../../../../../../test_utils/enzyme_helpers';
import { ReasonFound } from '../';
const enabler = {};
describe('ReasonFound', () => {
test('should load ExplainCollectionInterval component', () => {
const component = render(
const component = renderWithIntl(
<ReasonFound
reason={{
property: 'xpack.monitoring.collection.interval',
@ -26,7 +26,7 @@ describe('ReasonFound', () => {
});
test('should load ExplainExporters component', () => {
const component = render(
const component = renderWithIntl(
<ReasonFound
reason={{
property: 'xpack.monitoring.exporters',
@ -40,7 +40,7 @@ describe('ReasonFound', () => {
});
test('should load ExplainPluginEnabled component', () => {
const component = render(
const component = renderWithIntl(
<ReasonFound
reason={{
property: 'xpack.monitoring.enabled',

View file

@ -5,12 +5,12 @@
*/
import React from 'react';
import { render } from 'enzyme';
import { renderWithIntl } from '../../../../../../../test_utils/enzyme_helpers';
import { WeTried } from '../';
describe('WeTried', () => {
test('should render "we tried" message', () => {
const component = render(<WeTried />);
const component = renderWithIntl(<WeTried />);
expect(component).toMatchSnapshot();
});
});

View file

@ -16,6 +16,7 @@ import {
ExplainExporters,
ExplainPluginEnabled
} from '../explanations';
import { FormattedMessage } from '@kbn/i18n/react';
const ExplainWhyNoData = ({ reason, ...props }) => {
const { property, data, context } = reason;
@ -32,8 +33,15 @@ const ExplainWhyNoData = ({ reason, ...props }) => {
return (
<EuiText>
<p>
There is a <EuiCode>{context}</EuiCode> setting that has{' '}
<EuiCode>{property}</EuiCode> set to <EuiCode>{data}</EuiCode>.
<FormattedMessage
id="xpack.monitoring.noData.reasons.explainWhyNoDataDescription"
defaultMessage="There is a {context} setting that has {property} set to {data}."
values={{
context: (<EuiCode>{context}</EuiCode>),
property: (<EuiCode>{property}</EuiCode>),
data: (<EuiCode>{data}</EuiCode>)
}}
/>
</p>
</EuiText>
);

View file

@ -10,21 +10,33 @@ import {
EuiHorizontalRule,
EuiTitle,
} from '@elastic/eui';
import { FormattedMessage } from '@kbn/i18n/react';
export function WeTried() {
return (
<Fragment>
<EuiTitle size="l">
<h2>We couldn&apos;t activate monitoring</h2>
<h2>
<FormattedMessage
id="xpack.monitoring.noData.reasons.couldNotActivateMonitoringTitle"
defaultMessage="We couldn't activate monitoring"
/>
</h2>
</EuiTitle>
<EuiHorizontalRule size="half" />
<EuiText className="eui-textLeft">
<p>
No monitoring data found. Try setting the time filter to &quot;Last 1
hour&quot; or check if data is available for a different time period.
<FormattedMessage
id="xpack.monitoring.noData.reasons.noMonitoringDataFoundDescription"
defaultMessage="No monitoring data found. Try setting the time filter to &quot;Last 1
hour&quot; or check if data is available for a different time period."
/>
</p>
<p>
If data is in your cluster, your monitoring dashboards will show up here.
<FormattedMessage
id="xpack.monitoring.noData.reasons.ifDataInClusterDescription"
defaultMessage="If data is in your cluster, your monitoring dashboards will show up here."
/>
</p>
</EuiText>
</Fragment>

View file

@ -29,7 +29,7 @@ exports[`PageLoading should show a simple page loading component 1`] = `
<div
class="euiFlexItem euiFlexItem--flexGrowZero"
>
Loading...
Loading
</div>
</div>
</div>

View file

@ -5,12 +5,12 @@
*/
import React from 'react';
import { render } from 'enzyme';
import { renderWithIntl } from '../../../../../../test_utils/enzyme_helpers';
import { PageLoading } from '../';
describe('PageLoading', () => {
test('should show a simple page loading component', () => {
expect(render(<PageLoading />)).toMatchSnapshot();
expect(renderWithIntl(<PageLoading />)).toMatchSnapshot();
});
});

View file

@ -13,6 +13,7 @@ import {
EuiFlexItem,
EuiLoadingSpinner
} from '@elastic/eui';
import { FormattedMessage } from '@kbn/i18n/react';
export function PageLoading() {
return (
@ -29,7 +30,12 @@ export function PageLoading() {
<EuiFlexItem grow={false}>
<EuiLoadingSpinner size="xl" />
</EuiFlexItem>
<EuiFlexItem grow={false}>Loading...</EuiFlexItem>
<EuiFlexItem grow={false}>
<FormattedMessage
id="xpack.monitoring.pageLoadingTitle"
defaultMessage="Loading…"
/>
</EuiFlexItem>
</EuiFlexGroup>
</EuiFlexItem>
</EuiFlexGroup>

View file

@ -10,6 +10,7 @@ import { render, unmountComponentAtNode } from 'react-dom';
import { getPageData } from '../lib/get_page_data';
import { PageLoading } from 'plugins/monitoring/components';
import { timefilter } from 'ui/timefilter';
import { I18nProvider } from '@kbn/i18n/react';
/**
* Class to manage common instantiation behaviors in a view controller
@ -129,7 +130,7 @@ export class MonitoringViewBaseController {
renderReact(component) {
if (this._isDataInitialized === false) {
render(<PageLoading />, document.getElementById(this.reactNodeId));
render(<I18nProvider><PageLoading /></I18nProvider>, document.getElementById(this.reactNodeId));
} else {
render(component, document.getElementById(this.reactNodeId));
}

View file

@ -12,11 +12,12 @@ import { formatDateTimeLocal } from '../../../common/formatting';
import { MANAGEMENT_BASE_PATH } from 'plugins/xpack_main/components';
import { License } from 'plugins/monitoring/components';
import { timefilter } from 'ui/timefilter';
import { I18nProvider } from '@kbn/i18n/react';
const REACT_NODE_ID = 'licenseReact';
export class LicenseViewController {
constructor($injector, $scope) {
constructor($injector, $scope, i18n) {
timefilter.disableTimeRangeSelector();
timefilter.disableAutoRefreshSelector();
@ -24,17 +25,20 @@ export class LicenseViewController {
unmountComponentAtNode(document.getElementById(REACT_NODE_ID));
});
this.init($injector, $scope);
this.init($injector, $scope, i18n);
}
init($injector, $scope) {
init($injector, $scope, i18n) {
const globalState = $injector.get('globalState');
const title = $injector.get('title');
const $route = $injector.get('$route');
const cluster = find($route.current.locals.clusters, { cluster_uuid: globalState.cluster_uuid });
$scope.cluster = cluster;
title($scope.cluster, 'License');
const routeTitle = i18n('xpack.monitoring.license.licenseRouteTitle', {
defaultMessage: 'License'
});
title($scope.cluster, routeTitle);
this.license = cluster.license;
this.isExpired = Date.now() > get(cluster, 'license.expiry_date_in_millis');
@ -56,14 +60,16 @@ export class LicenseViewController {
// Mount the React component to the template
render(
<License
isPrimaryCluster={isPrimaryCluster}
status={license.status}
type={license.type}
isExpired={isExpired}
expiryDate={expiryDate}
uploadLicensePath={uploadLicensePath}
/>,
<I18nProvider>
<License
isPrimaryCluster={isPrimaryCluster}
status={license.status}
type={license.type}
isExpired={isExpired}
expiryDate={expiryDate}
uploadLicensePath={uploadLicensePath}
/>
</I18nProvider>,
document.getElementById(REACT_NODE_ID)
);
});

View file

@ -15,6 +15,7 @@ import { ModelUpdater } from './model_updater';
import { render, unmountComponentAtNode } from 'react-dom';
import { NoData } from 'plugins/monitoring/components';
import { timefilter } from 'ui/timefilter';
import { I18nProvider } from '@kbn/i18n/react';
const REACT_NODE_ID_NO_DATA = 'noDataReact';
@ -69,7 +70,9 @@ export class NoDataController {
() => model,
props => {
render(
<NoData {...props} enabler={enabler} />,
<I18nProvider>
<NoData {...props} enabler={enabler} />
</I18nProvider>,
document.getElementById(REACT_NODE_ID_NO_DATA)
);
},