Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Localize JobDetails tabs of Rollup Job Wizard #23020

Merged
merged 1 commit into from
Sep 13, 2018
Merged

Localize JobDetails tabs of Rollup Job Wizard #23020

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
20 changes: 17 additions & 3 deletions x-pack/plugins/rollup/public/crud_app/sections/components/job_details/tabs/tab_histogram.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -5,6 +5,7 @@
*/

import React, { Fragment } from 'react';
import { injectI18n, FormattedMessage } from '@kbn/i18n/react';

import {
EuiTitle,
Expand All @@ -14,7 +15,7 @@ import {
EuiFlexItem,
} from '@elastic/eui';

export const TabHistogram = ({ histogram, histogramInterval }) => {
export const TabHistogramUi = ({ histogram, histogramInterval }) => {
// TODO: Render a table if there are more than 20 fields.

const renderedTerms = histogram.map(({ name }) => {
Expand All @@ -30,13 +31,24 @@ export const TabHistogram = ({ histogram, histogramInterval }) => {
<EuiFlexGroup alignItems="center" justifyContent="spaceBetween">
<EuiFlexItem grow={false}>
<EuiTitle size="s">
<h3>Histogram</h3>
<h3>
<FormattedMessage
id="xpack.rollupJobs.jobDetails.tabHistogram.sectionHistogram.title"
defaultMessage="Histogram"
/>
</h3>
</EuiTitle>
</EuiFlexItem>

<EuiFlexItem grow={false}>
<EuiText>
<p>Interval: {histogramInterval}</p>
<p>
<FormattedMessage
id="xpack.rollupJobs.jobDetails.tabHistogram.interval.label"
defaultMessage="Interval: {histogramInterval}"
values={{ histogramInterval }}
/>
</p>
</EuiText>
</EuiFlexItem>
</EuiFlexGroup>
Expand All @@ -51,3 +63,5 @@ export const TabHistogram = ({ histogram, histogramInterval }) => {
</Fragment>
);
};

export const TabHistogram = injectI18n(TabHistogramUi);
12 changes: 10 additions & 2 deletions x-pack/plugins/rollup/public/crud_app/sections/components/job_details/tabs/tab_json.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -5,22 +5,28 @@
*/

import React, { Fragment } from 'react';
import { injectI18n, FormattedMessage } from '@kbn/i18n/react';

import {
EuiTitle,
EuiSpacer,
EuiCodeEditor,
} from '@elastic/eui';

export const TabJson = ({
export const TabJsonUi = ({
json,
}) => {
const jsonString = JSON.stringify(json, null, 2);

return (
<Fragment>
<EuiTitle size="s">
<h3>JSON</h3>
<h3>
<FormattedMessage
id="xpack.rollupJobs.jobDetails.tabJson.sectionJson.title"
defaultMessage="JSON"
/>
</h3>
</EuiTitle>

<EuiSpacer size="s" />
Expand All @@ -38,3 +44,5 @@ export const TabJson = ({
</Fragment>
);
};

export const TabJson = injectI18n(TabJsonUi);
12 changes: 10 additions & 2 deletions x-pack/plugins/rollup/public/crud_app/sections/components/job_details/tabs/tab_metrics.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -5,14 +5,15 @@
*/

import React, { Fragment } from 'react';
import { injectI18n, FormattedMessage } from '@kbn/i18n/react';

import {
EuiDescriptionList,
EuiTitle,
EuiSpacer,
} from '@elastic/eui';

export const TabMetrics = ({ metrics }) => {
export const TabMetricsUi = ({ metrics }) => {
// TODO: Render a table if there are more than 20 metrics.
const listMetrics = metrics.map(({ name, types }) => {
return {
Expand All @@ -24,7 +25,12 @@ export const TabMetrics = ({ metrics }) => {
return (
<Fragment>
<EuiTitle size="s">
<h3>Metrics</h3>
<h3>
<FormattedMessage
id="xpack.rollupJobs.jobDetails.tabMetrics.sectionMetrics.title"
defaultMessage="Metrics"
/>
</h3>
</EuiTitle>

<EuiSpacer size="s" />
Expand All @@ -33,3 +39,5 @@ export const TabMetrics = ({ metrics }) => {
</Fragment>
);
};

export const TabMetrics = injectI18n(TabMetricsUi);
143 changes: 117 additions & 26 deletions x-pack/plugins/rollup/public/crud_app/sections/components/job_details/tabs/tab_summary.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -6,6 +6,7 @@

import React, { Component, Fragment } from 'react';
import PropTypes from 'prop-types';
import { injectI18n, FormattedMessage } from '@kbn/i18n/react';

import {
EuiDescriptionList,
Expand All @@ -18,7 +19,7 @@ import {

import { JobStatus } from '../../job_status';

export class TabSummary extends Component {
export class TabSummaryUi extends Component {
static propTypes = {
job: PropTypes.object.isRequired,
stats: PropTypes.object,
Expand All @@ -44,48 +45,76 @@ export class TabSummary extends Component {
<EuiSpacer size="s" />

<EuiTitle size="s">
<h3>Stats</h3>
<h3>
<FormattedMessage
id="xpack.rollupJobs.jobDetails.tabSummary.sectionStats.title"
defaultMessage="Stats"
/>
</h3>
</EuiTitle>

<EuiSpacer size="s" />

<EuiDescriptionList type="column" align="center">
<Fragment>
<EuiDescriptionListTitle>
<strong>Status</strong>
</EuiDescriptionListTitle>
<EuiDescriptionListTitle>
<strong>
<FormattedMessage
id="xpack.rollupJobs.jobDetails.tabSummary.itemStatus.label"
defaultMessage="Status"
/>
</strong>
</EuiDescriptionListTitle>

<EuiDescriptionListDescription>
<JobStatus status={status} />
</EuiDescriptionListDescription>
</Fragment>
<EuiDescriptionListDescription>
<JobStatus status={status} />
</EuiDescriptionListDescription>

<EuiDescriptionListTitle>
<strong>Documents processed</strong>
<strong>
<FormattedMessage
id="xpack.rollupJobs.jobDetails.tabSummary.itemDocumentsProcessed.label"
defaultMessage="Documents processed"
/>
</strong>
</EuiDescriptionListTitle>

<EuiDescriptionListDescription>
{documentsProcessed}
</EuiDescriptionListDescription>

<EuiDescriptionListTitle>
<strong>Pages processed</strong>
<strong>
<FormattedMessage
id="xpack.rollupJobs.jobDetails.tabSummary.itemPagesProcessed.label"
defaultMessage="Pages processed"
/>
</strong>
</EuiDescriptionListTitle>

<EuiDescriptionListDescription>
{pagesProcessed}
</EuiDescriptionListDescription>

<EuiDescriptionListTitle>
<strong>Rollups indexed</strong>
<strong>
<FormattedMessage
id="xpack.rollupJobs.jobDetails.tabSummary.itemRollupsIndexed.label"
defaultMessage="Rollups indexed"
/>
</strong>
</EuiDescriptionListTitle>

<EuiDescriptionListDescription>
{rollupsIndexed}
</EuiDescriptionListDescription>

<EuiDescriptionListTitle>
<strong>Trigger count</strong>
<strong>
<FormattedMessage
id="xpack.rollupJobs.jobDetails.tabSummary.itemTriggerCount.label"
defaultMessage="Trigger count"
/>
</strong>
</EuiDescriptionListTitle>

<EuiDescriptionListDescription>
Expand All @@ -112,32 +141,57 @@ export class TabSummary extends Component {
return (
<Fragment>
<EuiTitle size="s">
<h3>Logistics</h3>
<h3>
<FormattedMessage
id="xpack.rollupJobs.jobDetails.tabSummary.sectionLogistics.label"
defaultMessage="Logistics"
/>
</h3>
</EuiTitle>

<EuiSpacer size="s" />

<EuiDescriptionList type="column" align="center">
<EuiDescriptionListTitle>
<strong>Index pattern</strong>
<strong>
<FormattedMessage
id="xpack.rollupJobs.jobDetails.tabSummary.itemIndexPattern.label"
defaultMessage="Index pattern"
/>
</strong>
</EuiDescriptionListTitle>

<EuiDescriptionListDescription className="eui-textBreakWord">
{indexPattern}
</EuiDescriptionListDescription>

<EuiDescriptionListTitle>
<strong>Rollup index</strong>
<strong>
<FormattedMessage
id="xpack.rollupJobs.jobDetails.tabSummary.itemRollupIndex.label"
defaultMessage="Rollup index"
/>
</strong>
</EuiDescriptionListTitle>

<EuiDescriptionListDescription className="eui-textBreakWord">
{rollupIndex}
</EuiDescriptionListDescription>

<EuiDescriptionListTitle>
<strong>Cron</strong>{' '}
<strong>
<FormattedMessage
id="xpack.rollupJobs.jobDetails.tabSummary.itemCron.label"
defaultMessage="Cron"
/>
</strong>{' '}
<EuiIconTip
content="Interval at which data is rolled up"
content={(
<FormattedMessage
id="xpack.rollupJobs.jobDetails.tabSummary.itemCron.tip"
defaultMessage="Interval at which data is rolled up"
/>
)}
/>
</EuiDescriptionListTitle>

Expand All @@ -149,40 +203,75 @@ export class TabSummary extends Component {
<EuiSpacer size="s" />

<EuiTitle size="s">
<h3>Date histogram</h3>
<h3>
<FormattedMessage
id="xpack.rollupJobs.jobDetails.tabSummary.sectionDateHistogram.label"
defaultMessage="Date histogram"
/>
</h3>
</EuiTitle>

<EuiSpacer size="s" />

<EuiDescriptionList type="column" align="center">
<EuiDescriptionListTitle>
<strong>Time field</strong>
<strong>
<FormattedMessage
id="xpack.rollupJobs.jobDetails.tabSummary.itemTimeField.label"
defaultMessage="Time field"
/>
</strong>
</EuiDescriptionListTitle>

<EuiDescriptionListDescription className="eui-textBreakWord">
{dateHistogramField}
</EuiDescriptionListDescription>

<EuiDescriptionListTitle>
<strong>Timezone</strong>
<strong>
<FormattedMessage
id="xpack.rollupJobs.jobDetails.tabSummary.itemTimezone.label"
defaultMessage="Timezone"
/>
</strong>
</EuiDescriptionListTitle>

<EuiDescriptionListDescription>
{dateHistogramTimeZone}
</EuiDescriptionListDescription>

<EuiDescriptionListTitle>
<strong>Delay</strong>
<strong>
<FormattedMessage
id="xpack.rollupJobs.jobDetails.tabSummary.itemDelay.label"
defaultMessage="Delay"
/>
</strong>
</EuiDescriptionListTitle>

<EuiDescriptionListDescription>
{dateHistogramDelay || 'None'}
{dateHistogramDelay || (
<FormattedMessage
id="xpack.rollupJobs.jobDetails.tabSummary.itemDelay.none"
defaultMessage="None"
/>
)}
</EuiDescriptionListDescription>

<EuiDescriptionListTitle>
<strong>Interval</strong>{' '}
<strong>
<FormattedMessage
id="xpack.rollupJobs.jobDetails.tabSummary.itemInterval.label"
defaultMessage="Interval"
/>
</strong>{' '}
<EuiIconTip
content="Time bucket interval generated at roll-up time"
content={(
<FormattedMessage
id="xpack.rollupJobs.jobDetails.tabSummary.itemInterval.tip"
defaultMessage="Time bucket interval generated at roll-up time"
/>
)}
/>
</EuiDescriptionListTitle>

Expand All @@ -196,3 +285,5 @@ export class TabSummary extends Component {
);
}
}

export const TabSummary = injectI18n(TabSummaryUi);
Loading