github-mirrors/kibana
1
0
Fork 0
mirror of https://github.com/elastic/kibana.git synced 2025-04-23 17:28:26 -04:00
Code Issues Projects Releases Packages Wiki Activity

[i18n] APM translations for ServiceDetails (#28452) (#28562)

Browse source 
* Translations for ServiceDetails

* Update message ids

* Fix message id
This commit is contained in:
Maryia Lapata 2019-01-14 10:26:03 +03:00 • committed by GitHub
parent 1d07b10eee
commit e734e244d6
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
9 changed files with 462 additions and 108 deletions
Download patch file Download diff file Expand all files Collapse all files

10
x-pack/plugins/apm/public/components/app/ServiceDetails/CPUUsageChart.tsx
View file

@ -5,6 +5,7 @@
*/
import { EuiTitle } from '@elastic/eui';
import { i18n } from '@kbn/i18n';
import React from 'react';
// @ts-ignore
import CustomPlot from 'x-pack/plugins/apm/public/components/shared/charts/CustomPlot';
@ -22,7 +23,14 @@ export function CPUUsageChart({ data, hoverXHandlers }: Props) {
return (
<React.Fragment>
<EuiTitle size="s">
<span>CPU usage</span>
<span>
{i18n.translate(
'xpack.apm.serviceDetails.metrics.cpuUsageChartTitle',
{
defaultMessage: 'CPU usage'
}
)}
</span>
</EuiTitle>
<CustomPlot
{...hoverXHandlers}

10
x-pack/plugins/apm/public/components/app/ServiceDetails/MemoryUsageChart.tsx
View file

@ -5,6 +5,7 @@
*/
import { EuiTitle } from '@elastic/eui';
import { i18n } from '@kbn/i18n';
import React from 'react';
// @ts-ignore
import CustomPlot from 'x-pack/plugins/apm/public/components/shared/charts/CustomPlot';
@ -22,7 +23,14 @@ export function MemoryUsageChart({ data, hoverXHandlers }: Props) {
return (
<React.Fragment>
<EuiTitle size="s">
<span>Memory usage</span>
<span>
{i18n.translate(
'xpack.apm.serviceDetails.metrics.memoryUsageChartTitle',
{
defaultMessage: 'Memory usage'
}
)}
</span>
</EuiTitle>
<CustomPlot
{...hoverXHandlers}

13
x-pack/plugins/apm/public/components/app/ServiceDetails/ServiceDetailTabs.tsx
View file

@ -4,6 +4,7 @@
* you may not use this file except in compliance with the Elastic License.
*/
import { i18n } from '@kbn/i18n';
import React from 'react';
import { HistoryTabs } from 'x-pack/plugins/apm/public/components/shared/HistoryTabs';
import { IUrlParams } from 'x-pack/plugins/apm/public/store/urlParams';
@ -23,7 +24,9 @@ export class ServiceDetailTabs extends React.Component<TabsProps> {
const { serviceName } = urlParams;
const tabs = [
{
name: 'Transactions',
name: i18n.translate('xpack.apm.serviceDetails.transactionsTabLabel', {
defaultMessage: 'Transactions'
}),
path: `/${serviceName}/transactions/${transactionTypes[0]}`,
routePath: `/${serviceName}/transactions/:transactionType?`,
render: () => (
@ -34,7 +37,9 @@ export class ServiceDetailTabs extends React.Component<TabsProps> {
)
},
{
name: 'Errors',
name: i18n.translate('xpack.apm.serviceDetails.errorsTabLabel', {
defaultMessage: 'Errors'
}),
path: `/${serviceName}/errors`,
render: () => {
return (
@ -43,7 +48,9 @@ export class ServiceDetailTabs extends React.Component<TabsProps> {
}
},
{
name: 'Metrics',
name: i18n.translate('xpack.apm.serviceDetails.metricsTabLabel', {
defaultMessage: 'Metrics'
}),
path: `/${serviceName}/metrics`,
render: () => <ServiceMetrics urlParams={urlParams} />
}

176
x-pack/plugins/apm/public/components/app/ServiceDetails/ServiceIntegrations/MachineLearningFlyout.tsx
View file

@ -18,6 +18,8 @@ import {
EuiText,
EuiTitle
} from '@elastic/eui';
import { i18n } from '@kbn/i18n';
import { FormattedMessage } from '@kbn/i18n/react';
import React, { Component } from 'react';
import { toastNotifications } from 'ui/notify';
import {
@ -98,11 +100,21 @@ export class MachineLearningFlyout extends Component<FlyoutProps, FlyoutState> {
}
toastNotifications.addWarning({
title: 'Job creation failed',
title: i18n.translate(
'xpack.apm.serviceDetails.enableAnomalyDetectionPanel.jobCreationFailedNotificationTitle',
{
defaultMessage: 'Job creation failed'
}
),
text: (
<p>
Your current license may not allow for creating machine learning jobs,
or this job may already exist.
{i18n.translate(
'xpack.apm.serviceDetails.enableAnomalyDetectionPanel.jobCreationFailedNotificationText',
{
defaultMessage:
'Your current license may not allow for creating machine learning jobs, or this job may already exist.'
}
)}
</p>
)
});
@ -113,18 +125,36 @@ export class MachineLearningFlyout extends Component<FlyoutProps, FlyoutState> {
const { serviceName = 'unknown', transactionType } = urlParams;
toastNotifications.addSuccess({
title: 'Job successfully created',
title: i18n.translate(
'xpack.apm.serviceDetails.enableAnomalyDetectionPanel.jobCreatedNotificationTitle',
{
defaultMessage: 'Job successfully created'
}
),
text: (
<p>
The analysis is now running for {serviceName} ({transactionType}
). It might take a while before results are added to the response
times graph.{' '}
{i18n.translate(
'xpack.apm.serviceDetails.enableAnomalyDetectionPanel.jobCreatedNotificationText',
{
defaultMessage:
'The analysis is now running for {serviceName} ({transactionType}). It might take a while before results are added to the response times graph.',
values: {
serviceName,
transactionType: transactionType as string
}
}
)}{' '}
<ViewMLJob
serviceName={serviceName}
transactionType={transactionType}
location={location}
>
View job
{i18n.translate(
'xpack.apm.serviceDetails.enableAnomalyDetectionPanel.jobCreatedNotificationText.viewJobLinkText',
{
defaultMessage: 'View job'
}
)}
</ViewMLJob>
</p>
)
@ -160,7 +190,14 @@ export class MachineLearningFlyout extends Component<FlyoutProps, FlyoutState> {
<EuiFlyout onClose={onClose} size="s">
<EuiFlyoutHeader>
<EuiTitle>
<h2>Enable anomaly detection</h2>
<h2>
{i18n.translate(
'xpack.apm.serviceDetails.enableAnomalyDetectionPanel.enableAnomalyDetectionTitle',
{
defaultMessage: 'Enable anomaly detection'
}
)}
</h2>
</EuiTitle>
<EuiSpacer size="s" />
</EuiFlyoutHeader>
@ -168,20 +205,38 @@ export class MachineLearningFlyout extends Component<FlyoutProps, FlyoutState> {
{hasMLJob && (
<div>
<EuiCallOut
title="Job already exists"
title={i18n.translate(
'xpack.apm.serviceDetails.enableAnomalyDetectionPanel.callout.jobExistsTitle',
{
defaultMessage: 'Job already exists'
}
)}
color="success"
iconType="check"
>
<p>
There is currently a job running for {serviceName} (
{transactionType}
).{' '}
{i18n.translate(
'xpack.apm.serviceDetails.enableAnomalyDetectionPanel.callout.jobExistsDescription',
{
defaultMessage:
'There is currently a job running for {serviceName} ({transactionType}).',
values: {
serviceName,
transactionType: transactionType as string
}
}
)}{' '}
<ViewMLJob
serviceName={serviceName}
transactionType={transactionType}
location={location}
>
View existing job
{i18n.translate(
'xpack.apm.serviceDetails.enableAnomalyDetectionPanel.callout.jobExistsDescription.viewJobLinkText',
{
defaultMessage: 'View existing job'
}
)}
</ViewMLJob>
</p>
</EuiCallOut>
@ -194,14 +249,25 @@ export class MachineLearningFlyout extends Component<FlyoutProps, FlyoutState> {
<EuiCallOut
title={
<span>
No APM index pattern available. To create a job,
please import the APM index pattern via the{' '}
<KibanaLink
pathname={'/app/kibana'}
hash={`/home/tutorial/apm`}
>
Setup Instructions
</KibanaLink>
<FormattedMessage
id="xpack.apm.serviceDetails.enableAnomalyDetectionPanel.callout.noPatternTitle"
defaultMessage="No APM index pattern available. To create a job, please import the APM index pattern via the {setupInstructionLink}"
values={{
setupInstructionLink: (
<KibanaLink
pathname={'/app/kibana'}
hash={`/home/tutorial/apm`}
>
{i18n.translate(
'xpack.apm.serviceDetails.enableAnomalyDetectionPanel.callout.noPatternTitle.setupInstructionLinkText',
{
defaultMessage: 'Setup Instructions'
}
)}
</KibanaLink>
)
}}
/>
</span>
}
color="warning"
@ -213,24 +279,53 @@ export class MachineLearningFlyout extends Component<FlyoutProps, FlyoutState> {
<EuiText>
<p>
Here you can create a machine learning job to calculate
anomaly scores on durations for APM transactions within the{' '}
{serviceName} service. Once enabled,{' '}
<b>the transaction duration graph</b> will show the expected
bounds and annotate the graph once the anomaly score is
&gt;=75.
<FormattedMessage
id="xpack.apm.serviceDetails.enableAnomalyDetectionPanel.createMLJobDescription"
defaultMessage="Here you can create a machine learning job to calculate anomaly scores on durations for APM transactions
within the {serviceName} service. Once enabled, {transactionDurationGraphText} will show the expected bounds and annotate
the graph once the anomaly score is &gt;=75."
values={{
serviceName,
transactionDurationGraphText: (
<b>
{i18n.translate(
'xpack.apm.serviceDetails.enableAnomalyDetectionPanel.createMLJobDescription.transactionDurationGraphText',
{
defaultMessage: 'the transaction duration graph'
}
)}
</b>
)
}}
/>
</p>
<p>
Jobs can be created for each service + transaction type
combination. Once a job is created, you can manage it and
see more details in the{' '}
<KibanaLink pathname={'/app/ml'}>
Machine Learning jobs management page
</KibanaLink>
.{' '}
<FormattedMessage
id="xpack.apm.serviceDetails.enableAnomalyDetectionPanel.manageMLJobDescription"
defaultMessage="Jobs can be created for each service + transaction type combination.
Once a job is created, you can manage it and see more details in the {mlJobsPageLink}."
values={{
mlJobsPageLink: (
<KibanaLink pathname={'/app/ml'}>
{i18n.translate(
'xpack.apm.serviceDetails.enableAnomalyDetectionPanel.manageMLJobDescription.mlJobsPageLinkText',
{
defaultMessage:
'Machine Learning jobs management page'
}
)}
</KibanaLink>
)
}}
/>{' '}
<em>
Note: It might take a few minutes for the job to begin
calculating results.
{i18n.translate(
'xpack.apm.serviceDetails.enableAnomalyDetectionPanel.manageMLJobDescription.noteText',
{
defaultMessage:
'Note: It might take a few minutes for the job to begin calculating results.'
}
)}
</em>
</p>
</EuiText>
@ -263,7 +358,12 @@ export class MachineLearningFlyout extends Component<FlyoutProps, FlyoutState> {
fill
disabled={isLoading || hasMLJob || !hasIndexPattern}
>
Create new job
{i18n.translate(
'xpack.apm.serviceDetails.enableAnomalyDetectionPanel.createNewJobButtonLabel',
{
defaultMessage: 'Create new job'
}
)}
</EuiButton>
</EuiFormRow>
</EuiFlexItem>

19
x-pack/plugins/apm/public/components/app/ServiceDetails/ServiceIntegrations/TransactionSelect.tsx
View file

@ -14,6 +14,7 @@ import {
EuiText,
EuiToolTip
} from '@elastic/eui';
import { i18n } from '@kbn/i18n';
import React from 'react';
import { MLJobApiResponse } from 'x-pack/plugins/apm/public/services/rest/ml';
@ -31,7 +32,14 @@ export const TransactionSelect: React.SFC<TransactionSelectProps> = ({
onChange
}) => {
return (
<EuiFormRow label="Select a transaction type for this job">
<EuiFormRow
label={i18n.translate(
'xpack.apm.serviceDetails.enableAnomalyDetectionPanel.selectTransactionTypeLabel',
{
defaultMessage: 'Select a transaction type for this job'
}
)}
>
<EuiSuperSelect
valueOfSelected={selected}
onChange={onChange}
@ -49,7 +57,14 @@ export const TransactionSelect: React.SFC<TransactionSelectProps> = ({
job => job.jobId && job.jobId.includes(type)
)
) ? (
<EuiToolTip content="ML job exists for this type">
<EuiToolTip
content={i18n.translate(
'xpack.apm.serviceDetails.enableAnomalyDetectionPanel.existedJobTooltip',
{
defaultMessage: 'ML job exists for this type'
}
)}
>
<EuiIcon type="machineLearningApp" />
</EuiToolTip>
) : (

267
x-pack/plugins/apm/public/components/app/ServiceDetails/ServiceIntegrations/WatcherFlyout.tsx
View file

@ -24,6 +24,8 @@ import {
EuiText,
EuiTitle
} from '@elastic/eui';
import { i18n } from '@kbn/i18n';
import { FormattedMessage } from '@kbn/i18n/react';
import { memoize, padLeft, range } from 'lodash';
import moment from 'moment-timezone';
import React, { Component } from 'react';
@ -210,24 +212,57 @@ export class WatcherFlyout extends Component<
public addErrorToast = () => {
toastNotifications.addWarning({
title: 'Watch creation failed',
text: <p>Make sure your user has permission to create watches.</p>
title: i18n.translate(
'xpack.apm.serviceDetails.enableErrorReportsPanel.watchCreationFailedNotificationTitle',
{
defaultMessage: 'Watch creation failed'
}
),
text: (
<p>
{i18n.translate(
'xpack.apm.serviceDetails.enableErrorReportsPanel.watchCreationFailedNotificationText',
{
defaultMessage:
'Make sure your user has permission to create watches.'
}
)}
</p>
)
});
};
public addSuccessToast = (id: string) => {
toastNotifications.addSuccess({
title: 'New watch created!',
title: i18n.translate(
'xpack.apm.serviceDetails.enableErrorReportsPanel.watchCreatedNotificationTitle',
{
defaultMessage: 'New watch created!'
}
),
text: (
<p>
The watch is now ready and will send error reports for{' '}
{this.props.urlParams.serviceName}.{' '}
{i18n.translate(
'xpack.apm.serviceDetails.enableErrorReportsPanel.watchCreatedNotificationText',
{
defaultMessage:
'The watch is now ready and will send error reports for {serviceName}.',
values: {
serviceName: this.props.urlParams.serviceName as string
}
}
)}{' '}
<UnconnectedKibanaLink
location={this.props.location}
pathname={'/app/kibana'}
hash={`/management/elasticsearch/watcher/watches/watch/${id}`}
>
View watch.
{i18n.translate(
'xpack.apm.serviceDetails.enableErrorReportsPanel.watchCreatedNotificationText.viewWatchLinkText',
{
defaultMessage: 'View watch'
}
)}
</UnconnectedKibanaLink>
</p>
)
@ -259,20 +294,48 @@ export class WatcherFlyout extends Component<
const flyoutBody = (
<EuiText>
<p>
This form will assist in creating a Watch that can notify you of error
occurrences from this service. To learn more about Watcher, please
read our{' '}
<EuiLink target="_blank" href={XPACK_DOCS.xpackWatcher}>
documentation
</EuiLink>
.
<FormattedMessage
id="xpack.apm.serviceDetails.enableErrorReportsPanel.formDescription"
defaultMessage="This form will assist in creating a Watch that can notify you of error occurrences from this service.
To learn more about Watcher, please read our {documentationLink}."
values={{
documentationLink: (
<EuiLink target="_blank" href={XPACK_DOCS.xpackWatcher}>
{i18n.translate(
'xpack.apm.serviceDetails.enableErrorReportsPanel.formDescription.documentationLinkText',
{
defaultMessage: 'documentation'
}
)}
</EuiLink>
)
}}
/>
</p>
<EuiForm>
<h3>Condition</h3>
<h3>
{i18n.translate(
'xpack.apm.serviceDetails.enableErrorReportsPanel.conditionTitle',
{
defaultMessage: 'Condition'
}
)}
</h3>
<EuiFormRow
label="Occurrences threshold per error group"
helpText="Threshold to be met for error group to be included in report."
label={i18n.translate(
'xpack.apm.serviceDetails.enableErrorReportsPanel.occurrencesThresholdLabel',
{
defaultMessage: 'Occurrences threshold per error group'
}
)}
helpText={i18n.translate(
'xpack.apm.serviceDetails.enableErrorReportsPanel.occurrencesThresholdHelpText',
{
defaultMessage:
'Threshold to be met for error group to be included in report.'
}
)}
compressed
>
<EuiFieldNumber
@ -283,16 +346,33 @@ export class WatcherFlyout extends Component<
/>
</EuiFormRow>
<h3>Trigger schedule</h3>
<h3>
{i18n.translate(
'xpack.apm.serviceDetails.enableErrorReportsPanel.triggerScheduleTitle',
{
defaultMessage: 'Trigger schedule'
}
)}
</h3>
<p>
Choose the time interval for the report, when the threshold is
exceeded.
{i18n.translate(
'xpack.apm.serviceDetails.enableErrorReportsPanel.triggerScheduleDescription',
{
defaultMessage:
'Choose the time interval for the report, when the threshold is exceeded.'
}
)}
</p>
<EuiRadio
id="daily"
label="Daily report"
label={i18n.translate(
'xpack.apm.serviceDetails.enableErrorReportsPanel.dailyReportRadioButtonLabel',
{
defaultMessage: 'Daily report'
}
)}
onChange={() => this.onChangeSchedule('daily')}
checked={this.state.schedule === 'daily'}
/>
@ -300,7 +380,14 @@ export class WatcherFlyout extends Component<
<EuiSpacer size="m" />
<EuiFormRow
helpText={`The daily report will be sent at ${dailyTimeFormatted} / ${dailyTime12HourFormatted}.`}
helpText={i18n.translate(
'xpack.apm.serviceDetails.enableErrorReportsPanel.dailyReportHelpText',
{
defaultMessage:
'The daily report will be sent at {dailyTimeFormatted} / {dailyTime12HourFormatted}.',
values: { dailyTimeFormatted, dailyTime12HourFormatted }
}
)}
compressed
>
<EuiSelect
@ -313,7 +400,12 @@ export class WatcherFlyout extends Component<
<EuiRadio
id="interval"
label="Interval"
label={i18n.translate(
'xpack.apm.serviceDetails.enableErrorReportsPanel.intervalRadioButtonLabel',
{
defaultMessage: 'Interval'
}
)}
onChange={() => this.onChangeSchedule('interval')}
checked={this.state.schedule === 'interval'}
/>
@ -324,7 +416,12 @@ export class WatcherFlyout extends Component<
<EuiFlexItem grow={false}>
<SmallInput>
<EuiFormRow
helpText="Time interval between reports."
helpText={i18n.translate(
'xpack.apm.serviceDetails.enableErrorReportsPanel.intervalHelpText',
{
defaultMessage: 'Time interval between reports.'
}
)}
compressed
>
<EuiFieldNumber
@ -345,11 +442,21 @@ export class WatcherFlyout extends Component<
options={[
{
value: 'm',
text: 'mins'
text: i18n.translate(
'xpack.apm.serviceDetails.enableErrorReportsPanel.intervalUnit.minsLabel',
{
defaultMessage: 'mins'
}
)
},
{
value: 'h',
text: 'hrs'
text: i18n.translate(
'xpack.apm.serviceDetails.enableErrorReportsPanel.intervalUnit.hrsLabel',
{
defaultMessage: 'hrs'
}
)
}
]}
disabled={this.state.schedule !== 'interval'}
@ -358,13 +465,30 @@ export class WatcherFlyout extends Component<
</EuiFlexItem>
</EuiFlexGroup>
<h3>Actions</h3>
<h3>
{i18n.translate(
'xpack.apm.serviceDetails.enableErrorReportsPanel.actionsTitle',
{
defaultMessage: 'Actions'
}
)}
</h3>
<p>
Reports can be sent by email or posted to a Slack channel. Each
report will include the top 10 errors sorted by occurrence.
{i18n.translate(
'xpack.apm.serviceDetails.enableErrorReportsPanel.actionsDescription',
{
defaultMessage:
'Reports can be sent by email or posted to a Slack channel. Each report will include the top 10 errors sorted by occurrence.'
}
)}
</p>
<EuiSwitch
label="Send email"
label={i18n.translate(
'xpack.apm.serviceDetails.enableErrorReportsPanel.sendEmailLabel',
{
defaultMessage: 'Send email'
}
)}
checked={this.state.actions.email}
onChange={() => this.onChangeAction('email')}
/>
@ -372,15 +496,31 @@ export class WatcherFlyout extends Component<
<EuiSpacer size="m" />
{this.state.actions.email && (
<EuiFormRow
label="Recipients (separated with comma)"
label={i18n.translate(
'xpack.apm.serviceDetails.enableErrorReportsPanel.recipientsLabel',
{
defaultMessage: 'Recipients (separated with comma)'
}
)}
compressed
helpText={
<span>
If you have not configured email, please see the{' '}
<EuiLink target="_blank" href={XPACK_DOCS.xpackEmails}>
documentation
</EuiLink>
.
<FormattedMessage
id="xpack.apm.serviceDetails.enableErrorReportsPanel.recipientsHelpText"
defaultMessage="If you have not configured email, please see the {documentationLink}."
values={{
documentationLink: (
<EuiLink target="_blank" href={XPACK_DOCS.xpackEmails}>
{i18n.translate(
'xpack.apm.serviceDetails.enableErrorReportsPanel.recipientsHelpText.documentationLinkText',
{
defaultMessage: 'documentation'
}
)}
</EuiLink>
)
}}
/>
</span>
}
>
@ -393,7 +533,12 @@ export class WatcherFlyout extends Component<
)}
<EuiSwitch
label="Send Slack notification"
label={i18n.translate(
'xpack.apm.serviceDetails.enableErrorReportsPanel.sendSlackNotificationLabel',
{
defaultMessage: 'Send Slack notification'
}
)}
checked={this.state.actions.slack}
onChange={() => this.onChangeAction('slack')}
/>
@ -401,18 +546,34 @@ export class WatcherFlyout extends Component<
{this.state.actions.slack && (
<EuiFormRow
label="Slack Webhook URL"
label={i18n.translate(
'xpack.apm.serviceDetails.enableErrorReportsPanel.slackWebhookURLLabel',
{
defaultMessage: 'Slack Webhook URL'
}
)}
compressed
helpText={
<span>
To get a Slack webhook, please see the{' '}
<EuiLink
target="_blank"
href="https://get.slack.help/hc/en-us/articles/115005265063-Incoming-WebHooks-for-Slack"
>
documentation
</EuiLink>
.
<FormattedMessage
id="xpack.apm.serviceDetails.enableErrorReportsPanel.slackWebhookURLHelpText"
defaultMessage="To get a Slack webhook, please see the {documentationLink}."
values={{
documentationLink: (
<EuiLink
target="_blank"
href="https://get.slack.help/hc/en-us/articles/115005265063-Incoming-WebHooks-for-Slack"
>
{i18n.translate(
'xpack.apm.serviceDetails.enableErrorReportsPanel.slackWebhookURLHelpText.documentationLinkText',
{
defaultMessage: 'documentation'
}
)}
</EuiLink>
)
}}
/>
</span>
}
>
@ -431,7 +592,14 @@ export class WatcherFlyout extends Component<
<EuiFlyout onClose={this.props.onClose} size="s">
<EuiFlyoutHeader>
<EuiTitle>
<h2>Enable error reports</h2>
<h2>
{i18n.translate(
'xpack.apm.serviceDetails.enableErrorReportsPanel.enableErrorReportsTitle',
{
defaultMessage: 'Enable error reports'
}
)}
</h2>
</EuiTitle>
</EuiFlyoutHeader>
<EuiFlyoutBody>{flyoutBody}</EuiFlyoutBody>
@ -441,7 +609,12 @@ export class WatcherFlyout extends Component<
fill
disabled={!this.state.actions.email && !this.state.actions.slack}
>
Create watch
{i18n.translate(
'xpack.apm.serviceDetails.enableErrorReportsPanel.createWatchButtonLabel',
{
defaultMessage: 'Create watch'
}
)}
</EuiButton>
</EuiFlyoutFooter>
</EuiFlyout>

43
x-pack/plugins/apm/public/components/app/ServiceDetails/ServiceIntegrations/view.tsx
View file

@ -10,6 +10,7 @@ import {
EuiContextMenuPanelItemDescriptor,
EuiPopover
} from '@elastic/eui';
import { i18n } from '@kbn/i18n';
import { memoize } from 'lodash';
import React from 'react';
import chrome from 'ui/chrome';
@ -46,16 +47,31 @@ export class ServiceIntegrationsView extends React.Component<
public getMLPanelItems = () => {
return [
{
name: 'Enable ML anomaly detection',
name: i18n.translate(
'xpack.apm.serviceDetails.integrationsMenu.enableMLAnomalyDetectionButtonLabel',
{
defaultMessage: 'Enable ML anomaly detection'
}
),
icon: 'machineLearningApp',
toolTipContent: 'Set up a machine learning job for this service',
toolTipContent: i18n.translate(
'xpack.apm.serviceDetails.integrationsMenu.enableMLAnomalyDetectionButtonTooltip',
{
defaultMessage: 'Set up a machine learning job for this service'
}
),
onClick: () => {
this.closePopover();
this.openFlyout('ML');
}
},
{
name: 'View existing ML jobs',
name: i18n.translate(
'xpack.apm.serviceDetails.integrationsMenu.viewMLJobsButtonLabel',
{
defaultMessage: 'View existing ML jobs'
}
),
icon: 'machineLearningApp',
href: chrome.addBasePath('/app/ml'),
target: '_blank',
@ -67,7 +83,12 @@ export class ServiceIntegrationsView extends React.Component<
public getWatcherPanelItems = () => {
return [
{
name: 'Enable watcher error reports',
name: i18n.translate(
'xpack.apm.serviceDetails.integrationsMenu.enableWatcherErrorReportsButtonLabel',
{
defaultMessage: 'Enable watcher error reports'
}
),
icon: 'watchesApp',
onClick: () => {
this.closePopover();
@ -75,7 +96,12 @@ export class ServiceIntegrationsView extends React.Component<
}
},
{
name: 'View existing watches',
name: i18n.translate(
'xpack.apm.serviceDetails.integrationsMenu.viewWatchesButtonLabel',
{
defaultMessage: 'View existing watches'
}
),
icon: 'watchesApp',
href: chrome.addBasePath(
'/app/kibana#/management/elasticsearch/watcher'
@ -108,7 +134,12 @@ export class ServiceIntegrationsView extends React.Component<
iconSide="right"
onClick={this.openPopover}
>
Integrations
{i18n.translate(
'xpack.apm.serviceDetails.integrationsMenu.integrationsButtonLabel',
{
defaultMessage: 'Integrations'
}
)}
</EuiButton>
);

10
x-pack/plugins/apm/public/components/app/ServiceDetails/ServiceMetrics.tsx
View file

@ -11,6 +11,7 @@ import {
EuiSpacer,
EuiTitle
} from '@elastic/eui';
import { i18n } from '@kbn/i18n';
import React from 'react';
// @ts-ignore
import Distribution from 'x-pack/plugins/apm/public/components/app/ErrorGroupDetails/Distribution';
@ -54,7 +55,14 @@ export const ServiceMetrics: React.SFC<ServiceMetricsProps> = ({
distribution={data}
title={
<EuiTitle size="s">
<span>Error occurrences</span>
<span>
{i18n.translate(
'xpack.apm.serviceDetails.metrics.errorOccurrencesChartTitle',
{
defaultMessage: 'Error occurrences'
}
)}
</span>
</EuiTitle>
}
/>

22
x-pack/plugins/apm/public/index.js
View file

@ -27,6 +27,8 @@ import LicenseChecker from './components/app/Main/LicenseChecker';
import { history } from './utils/url';
import { I18nProvider } from '@kbn/i18n/react';
chrome.setRootTemplate(template);
const store = configureStore();
@ -43,15 +45,17 @@ initTimepicker(history, store.dispatch).then(() => {
);
ReactDOM.render(
<Provider store={store}>
<Fragment>
<GlobalProgress />
<LicenseChecker />
<Router history={history}>
<Main />
</Router>
</Fragment>
</Provider>,
<I18nProvider>
<Provider store={store}>
<Fragment>
<GlobalProgress />
<LicenseChecker />
<Router history={history}>
<Main />
</Router>
</Fragment>
</Provider>
</I18nProvider>,
document.getElementById('react-apm-root')
);
});