diff --git a/.i18nrc.json b/.i18nrc.json index da5e14a803709..db74e93bb5ed9 100644 --- a/.i18nrc.json +++ b/.i18nrc.json @@ -11,6 +11,8 @@ "tableVis": "src/core_plugins/table_vis", "regionMap": "src/core_plugins/region_map", "statusPage": "src/core_plugins/status_page", + "tagCloud": "src/core_plugins/tagcloud", + "tagCloud": "src/core_plugins/tagcloud", "tileMap": "src/core_plugins/tile_map", "timelion": "src/core_plugins/timelion", "tsvb": "src/core_plugins/metrics", diff --git a/src/core_plugins/metrics/common/agg_lookup.js b/src/core_plugins/metrics/common/agg_lookup.js index b738442ff6c1f..2de9a1aee206c 100644 --- a/src/core_plugins/metrics/common/agg_lookup.js +++ b/src/core_plugins/metrics/common/agg_lookup.js @@ -18,37 +18,39 @@ */ import _ from 'lodash'; +import { i18n } from '@kbn/i18n'; + const lookup = { - count: 'Count', - calculation: 'Calculation', - std_deviation: 'Std. Deviation', - variance: 'Variance', - sum_of_squares: 'Sum of Sq.', - avg: 'Average', - max: 'Max', - min: 'Min', - sum: 'Sum', - percentile: 'Percentile', - percentile_rank: 'Percentile Rank', - cardinality: 'Cardinality', - value_count: 'Value Count', - derivative: 'Derivative', - cumulative_sum: 'Cumulative Sum', - moving_average: 'Moving Average', - avg_bucket: 'Overall Average', - min_bucket: 'Overall Min', - max_bucket: 'Overall Max', - sum_bucket: 'Overall Sum', - variance_bucket: 'Overall Variance', - sum_of_squares_bucket: 'Overall Sum of Sq.', - std_deviation_bucket: 'Overall Std. Deviation', - series_agg: 'Series Agg', - math: 'Math', - serial_diff: 'Serial Difference', - filter_ratio: 'Filter Ratio', - positive_only: 'Positive Only', - static: 'Static Value', - top_hit: 'Top Hit', + count: i18n.translate('tsvb.aggLookup.countLabel', { defaultMessage: 'Count' }), + calculation: i18n.translate('tsvb.aggLookup.calculationLabel', { defaultMessage: 'Calculation' }), + std_deviation: i18n.translate('tsvb.aggLookup.deviationLabel', { defaultMessage: 'Std. Deviation' }), + variance: i18n.translate('tsvb.aggLookup.varianceLabel', { defaultMessage: 'Variance' }), + sum_of_squares: i18n.translate('tsvb.aggLookup.sumOfSqLabel', { defaultMessage: 'Sum of Sq.' }), + avg: i18n.translate('tsvb.aggLookup.averageLabel', { defaultMessage: 'Average' }), + max: i18n.translate('tsvb.aggLookup.maxLabel', { defaultMessage: 'Max' }), + min: i18n.translate('tsvb.aggLookup.minLabel', { defaultMessage: 'Min' }), + sum: i18n.translate('tsvb.aggLookup.sumLabel', { defaultMessage: 'Sum' }), + percentile: i18n.translate('tsvb.aggLookup.percentileLabel', { defaultMessage: 'Percentile' }), + percentile_rank: i18n.translate('tsvb.aggLookup.percentileRankLabel', { defaultMessage: 'Percentile Rank' }), + cardinality: i18n.translate('tsvb.aggLookup.cardinalityLabel', { defaultMessage: 'Cardinality' }), + value_count: i18n.translate('tsvb.aggLookup.valueCountLabel', { defaultMessage: 'Value Count' }), + derivative: i18n.translate('tsvb.aggLookup.derivativeLabel', { defaultMessage: 'Derivative' }), + cumulative_sum: i18n.translate('tsvb.aggLookup.cumulativeSumLabel', { defaultMessage: 'Cumulative Sum' }), + moving_average: i18n.translate('tsvb.aggLookup.movingAverageLabel', { defaultMessage: 'Moving Average' }), + avg_bucket: i18n.translate('tsvb.aggLookup.overallAverageLabel', { defaultMessage: 'Overall Average' }), + min_bucket: i18n.translate('tsvb.aggLookup.overallMinLabel', { defaultMessage: 'Overall Min' }), + max_bucket: i18n.translate('tsvb.aggLookup.overallMaxLabel', { defaultMessage: 'Overall Max' }), + sum_bucket: i18n.translate('tsvb.aggLookup.overallSumLabel', { defaultMessage: 'Overall Sum' }), + variance_bucket: i18n.translate('tsvb.aggLookup.overallVarianceLabel', { defaultMessage: 'Overall Variance' }), + sum_of_squares_bucket: i18n.translate('tsvb.aggLookup.overallSumOfSqLabel', { defaultMessage: 'Overall Sum of Sq.' }), + std_deviation_bucket: i18n.translate('tsvb.aggLookup.overallStdDeviationLabel', { defaultMessage: 'Overall Std. Deviation' }), + series_agg: i18n.translate('tsvb.aggLookup.seriesAggLabel', { defaultMessage: 'Series Agg' }), + math: i18n.translate('tsvb.aggLookup.mathLabel', { defaultMessage: 'Math' }), + serial_diff: i18n.translate('tsvb.aggLookup.serialDifferenceLabel', { defaultMessage: 'Serial Difference' }), + filter_ratio: i18n.translate('tsvb.aggLookup.filterRatioLabel', { defaultMessage: 'Filter Ratio' }), + positive_only: i18n.translate('tsvb.aggLookup.positiveOnlyLabel', { defaultMessage: 'Positive Only' }), + static: i18n.translate('tsvb.aggLookup.staticValueLabel', { defaultMessage: 'Static Value' }), + top_hit: i18n.translate('tsvb.aggLookup.topHitLabel', { defaultMessage: 'Top Hit' }), }; const pipeline = [ @@ -98,7 +100,10 @@ export function createOptions(type = '_all', siblings = []) { const disabled = _.includes(pipeline, value) ? !enablePipelines : false; return { label: disabled - ? `${label} (use the "+" button to add this pipeline agg)` + ? i18n.translate('tsvb.aggLookup.addPipelineAggDescription', { + defaultMessage: '{label} (use the "+" button to add this pipeline agg)', + values: { label } + }) : label, value, disabled, diff --git a/src/core_plugins/metrics/common/calculate_label.js b/src/core_plugins/metrics/common/calculate_label.js index b6e8dd3dce1b4..8bcb9e2277509 100644 --- a/src/core_plugins/metrics/common/calculate_label.js +++ b/src/core_plugins/metrics/common/calculate_label.js @@ -19,6 +19,8 @@ import { includes, startsWith } from 'lodash'; import lookup from './agg_lookup'; +import { i18n } from '@kbn/i18n'; + const paths = [ 'cumulative_sum', 'derivative', @@ -34,22 +36,34 @@ const paths = [ 'positive_only', ]; export default function calculateLabel(metric, metrics) { - if (!metric) return 'Unknown'; + if (!metric) return i18n.translate('tsvb.calculateLabel.unknownLabel', { defaultMessage: 'Unknown' }); if (metric.alias) return metric.alias; - if (metric.type === 'count') return 'Count'; - if (metric.type === 'calculation') return 'Bucket Script'; - if (metric.type === 'math') return 'Math'; - if (metric.type === 'series_agg') return `Series Agg (${metric.function})`; - if (metric.type === 'filter_ratio') return 'Filter Ratio'; - if (metric.type === 'static') return `Static Value of ${metric.value}`; + if (metric.type === 'count') return i18n.translate('tsvb.calculateLabel.countLabel', { defaultMessage: 'Count' }); + if (metric.type === 'calculation') { + return i18n.translate('tsvb.calculateLabel.bucketScriptsLabel', { defaultMessage: 'Bucket Script' }); + } + if (metric.type === 'math') return i18n.translate('tsvb.calculateLabel.mathLabel', { defaultMessage: 'Math' }); + if (metric.type === 'series_agg') { + return i18n.translate('tsvb.calculateLabel.seriesAggLabel', + { defaultMessage: 'Series Agg ({metricFunction})', values: { metricFunction: metric.function } } + ); + } + if (metric.type === 'filter_ratio') return i18n.translate('tsvb.calculateLabel.filterRatioLabel', { defaultMessage: 'Filter Ratio' }); + if (metric.type === 'static') { + return i18n.translate('tsvb.calculateLabel.staticValueLabel', + { defaultMessage: 'Static Value of {metricValue}', values: { metricValue: metric.value } } + ); + } if (metric.type === 'percentile_rank') { - return `${lookup[metric.type]} (${metric.value}) of ${metric.field}`; + return i18n.translate('tsvb.calculateLabel.percentileRankLabel', { + defaultMessage: '{lookupMetricType} ({metricValue}) of {metricField}', + values: { lookupMetricType: lookup[metric.type], metricValue: metric.value, metricField: metric.field } + }); } if (includes(paths, metric.type)) { - let additionalLabel = ''; const targetMetric = metrics.find(m => startsWith(metric.field, m.id)); const targetLabel = calculateLabel(targetMetric, metrics); // For percentiles we need to parse the field id to extract the percentile @@ -59,11 +73,20 @@ export default function calculateLabel(metric, metrics) { const percentileValueMatch = /\[([0-9\.]+)\]$/; const matches = metric.field.match(percentileValueMatch); if (matches) { - additionalLabel += ` (${matches[1]})`; + return i18n.translate('tsvb.calculateLabel.lookupMetricTypeOfTargetWithAdditionalLabel', { + defaultMessage: '{lookupMetricType} of {targetLabel} ({additionalLabel})', + values: { lookupMetricType: lookup[metric.type], targetLabel, additionalLabel: matches[1] } + }); } } - return `${lookup[metric.type]} of ${targetLabel}${additionalLabel}`; + return i18n.translate('tsvb.calculateLabel.lookupMetricTypeOfTargetLabel', { + defaultMessage: '{lookupMetricType} of {targetLabel}', + values: { lookupMetricType: lookup[metric.type], targetLabel } + }); } - return `${lookup[metric.type]} of ${metric.field}`; + return i18n.translate('tsvb.calculateLabel.lookupMetricTypeOfMetricFieldRankLabel', { + defaultMessage: '{lookupMetricType} of {metricField}', + values: { lookupMetricType: lookup[metric.type], metricField: metric.field } + }); } diff --git a/src/core_plugins/metrics/public/components/aggs/agg_row.js b/src/core_plugins/metrics/public/components/aggs/agg_row.js index 756e7b7eb3fd0..e778dcb6b4469 100644 --- a/src/core_plugins/metrics/public/components/aggs/agg_row.js +++ b/src/core_plugins/metrics/public/components/aggs/agg_row.js @@ -22,11 +22,14 @@ import React from 'react'; import _ from 'lodash'; import AddDeleteButtons from '../add_delete_buttons'; import { EuiToolTip, EuiButtonIcon, EuiIcon, EuiFlexGroup, EuiFlexItem } from '@elastic/eui'; +import { injectI18n, FormattedMessage } from '@kbn/i18n/react'; -function AggRow(props) { +function AggRowUi(props) { let iconType = 'eyeClosed'; let iconColor = 'subdued'; const last = _.last(props.siblings); + const { intl } = props; + if (last.id === props.model.id) { iconType = 'eye'; iconColor = 'text'; @@ -36,8 +39,17 @@ function AggRow(props) { if (!props.disableDelete) { dragHandle = ( - - + )} + > + ); @@ -56,8 +68,8 @@ function AggRow(props) { { return value === option.value; }); @@ -98,21 +186,23 @@ function AggSelect(props) { } else { options = [ { - label: 'Metric Aggregations', + label: intl.formatMessage({ id: 'tsvb.aggSelect.aggGroups.metricAggLabel', defaultMessage: 'Metric Aggregations' }), options: metricAggs, }, { - label: 'Parent Pipeline Aggregations', + label: intl.formatMessage({ + id: 'tsvb.aggSelect.aggGroups.parentPipelineAggLabel', defaultMessage: 'Parent Pipeline Aggregations' }), options: pipelineAggs .filter(filterByPanelType(panelType)) - .map(agg => ({ ...agg, disabled: !enablePipelines })) + .map(agg => ({ ...agg, disabled: !enablePipelines })), }, { - label: 'Sibling Pipeline Aggregations', + label: intl.formatMessage({ + id: 'tsvb.aggSelect.aggGroups.siblingPipelineAggLabel', defaultMessage: 'Sibling Pipeline Aggregations' }), options: siblingAggs.map(agg => ({ ...agg, disabled: !enablePipelines })), }, { - label: 'Special Aggregations', + label: intl.formatMessage({ id: 'tsvb.aggSelect.aggGroups.specialAggLabel', defaultMessage: 'Special Aggregations' }), options: specialAggs.map(agg => ({ ...agg, disabled: !enablePipelines })), }, ]; @@ -127,7 +217,7 @@ function AggSelect(props) {
- Aggregation + + + - Variables + + + )} fullWidth helpText={
- Variables are keys on the params object, i.e. params.<name>. - To access the bucket interval (in milliseconds) use params._interval. + params), + paramsName: (params.<name>), + paramsInterval: (params._interval) + }} + />
} > diff --git a/src/core_plugins/metrics/public/components/aggs/cumulative_sum.js b/src/core_plugins/metrics/public/components/aggs/cumulative_sum.js index 5bb10f6982c56..09dad215d335e 100644 --- a/src/core_plugins/metrics/public/components/aggs/cumulative_sum.js +++ b/src/core_plugins/metrics/public/components/aggs/cumulative_sum.js @@ -24,6 +24,7 @@ import AggSelect from './agg_select'; import MetricSelect from './metric_select'; import createChangeHandler from '../lib/create_change_handler'; import createSelectHandler from '../lib/create_select_handler'; +import { FormattedMessage } from '@kbn/i18n/react'; import { htmlIdGenerator, EuiFlexGroup, EuiFlexItem, EuiFormLabel, EuiFormRow } from '@elastic/eui'; function CumulativeSumAgg(props) { @@ -41,7 +42,12 @@ function CumulativeSumAgg(props) { > - Aggregation + + + )} > { const { siblings } = props; @@ -56,7 +57,12 @@ export const DerivativeAgg = props => { > - Aggregation + + + { )} fullWidth > { )} fullWidth > { const { @@ -69,7 +70,12 @@ export const FilterRatioAgg = props => { - Aggregation + + + { - + )} + > { - + )} + > { - Metric Aggregation + + + { { model.metric_agg !== 'count' ? ( - + )} + > - Aggregation + + + - Variables + + + )} fullWidth - helpText={ -
- This field uses basic math expressions (see{' '} - - TinyMath - ) - Variables are keys on the params object, - i.e. params.<name> To access all the data use - params._all.<name>.values for an array of the - values and params._all.<name>.timestamps - for an array of the timestamps. params._timestamp - is available for the current bucket's timestamp, - params._index is available for the current - bucket's index, and params._intervals - available for the interval in milliseconds. -
- } + helpText={( + + ), + params: (params), + paramsName: (params.<name>), + paramsValues: (params._all.<name>.values), + paramsTimestamps: (params._all.<name>.timestamps), + paramsTimestamp: (params._timestamp), + paramsIndex: (params._index), + paramsInterval: (params._interval) + }} + />)} > { @@ -58,8 +59,8 @@ export function filterRows(includeSiblings) { }; } -function MetricSelect(props) { - const { additionalOptions, restrict, metric, metrics, onChange, value, exclude, includeSiblings, clearable, ...rest } = props; +function MetricSelectUi(props) { + const { additionalOptions, restrict, metric, metrics, onChange, value, exclude, includeSiblings, clearable, intl, ...rest } = props; const calculatedMetrics = metrics.filter(createTypeFilter(restrict, exclude)); @@ -97,7 +98,7 @@ function MetricSelect(props) { return ( { - const { siblings } = props; +const MovingAverageAggUi = props => { + const { siblings, intl } = props; const defaults = { settings: '', minimize: 0, @@ -52,11 +53,27 @@ export const MovingAverageAgg = props => { const handleTextChange = createTextHandler(handleChange); const handleNumberChange = createNumberHandler(handleChange); const modelOptions = [ - { label: 'Simple', value: 'simple' }, - { label: 'Linear', value: 'linear' }, - { label: 'Exponentially Weighted', value: 'ewma' }, - { label: 'Holt-Linear', value: 'holt' }, - { label: 'Holt-Winters', value: 'holt_winters' } + { + label: intl.formatMessage({ id: 'tsvb.movingAverage.modelOptions.simpleLabel', defaultMessage: 'Simple' }), + value: 'simple' + }, + { + label: intl.formatMessage({ id: 'tsvb.movingAverage.modelOptions.linearLabel', defaultMessage: 'Linear' }), + value: 'linear' + }, + { + label: intl.formatMessage({ + id: 'tsvb.movingAverage.modelOptions.exponentiallyWeightedLabel', defaultMessage: 'Exponentially Weighted' }), + value: 'ewma' + }, + { + label: intl.formatMessage({ id: 'tsvb.movingAverage.modelOptions.holtLinearLabel', defaultMessage: 'Holt-Linear' }), + value: 'holt' + }, + { + label: intl.formatMessage({ id: 'tsvb.movingAverage.modelOptions.holtWintersLabel', defaultMessage: 'Holt-Winters' }), + value: 'holt_winters' + } ]; const minimizeOptions = [ { label: 'True', value: 1 }, @@ -80,7 +97,12 @@ export const MovingAverageAgg = props => { > - Aggregation + + + { )} > { )} > { - + )} + > {/* EUITODO: The following input couldn't be converted to EUI because of type mis-match. Should it be text or number? @@ -137,9 +171,15 @@ export const MovingAverageAgg = props => { - + )} + > { - + )} + > {/* EUITODO: The following input couldn't be converted to EUI because of type mis-match. Should it be text or number? @@ -169,9 +215,18 @@ export const MovingAverageAgg = props => { )} helpText={ - Key=Value space-delimited + + Key=Value) }} + /> + } > { ); }; -MovingAverageAgg.propTypes = { +MovingAverageAggUi.propTypes = { disableDelete: PropTypes.bool, fields: PropTypes.object, model: PropTypes.object, @@ -196,3 +251,5 @@ MovingAverageAgg.propTypes = { series: PropTypes.object, siblings: PropTypes.array, }; + +export const MovingAverageAgg = injectI18n(MovingAverageAggUi); diff --git a/src/core_plugins/metrics/public/components/aggs/percentile.js b/src/core_plugins/metrics/public/components/aggs/percentile.js index 7a1e89db80830..4bf29f681df9e 100644 --- a/src/core_plugins/metrics/public/components/aggs/percentile.js +++ b/src/core_plugins/metrics/public/components/aggs/percentile.js @@ -38,12 +38,13 @@ import { EuiFieldNumber, EuiFormRow, } from '@elastic/eui'; +import { injectI18n, FormattedMessage } from '@kbn/i18n/react'; const newPercentile = (opts) => { return _.assign({ id: uuid.v1(), mode: 'line', shade: 0.2 }, opts); }; -class Percentiles extends Component { +class PercentilesUi extends Component { constructor(props) { super(props); @@ -64,9 +65,16 @@ class Percentiles extends Component { const model = { ...defaults, ...row }; const handleAdd = collectionActions.handleAdd.bind(null, this.props, newPercentile); const handleDelete = collectionActions.handleDelete.bind(null, this.props, model); + const { intl } = this.props; const modeOptions = [ - { label: 'Line', value: 'line' }, - { label: 'Band', value: 'band' } + { + label: intl.formatMessage({ id: 'tsvb.percentile.modeOptions.lineLabel', defaultMessage: 'Line' }), + value: 'line' + }, + { + label: intl.formatMessage({ id: 'tsvb.percentile.modeOptions.bandLabel', defaultMessage: 'Band' }), + value: 'band' + } ]; const optionsStyle = {}; if (model.mode === 'line') { @@ -82,8 +90,8 @@ class Percentiles extends Component { - Mode: + + + - Fill to: + + + - Shade (0 to 1): + + + - Aggregation + + + - + )} + > { const { series, panel, fields } = props; @@ -56,7 +57,12 @@ export const PercentileRankAgg = props => { > - Aggregation + + + { /> - + )} + > { - + )} + > { const { siblings } = props; @@ -46,7 +47,12 @@ export const PositiveOnlyAgg = props => { > - Aggregation + + + { )} > { const { siblings } = props; @@ -48,7 +49,12 @@ export const SerialDiffAgg = props => { > - Aggregation + + + { )} > { - + )} + > {/* EUITODO: The following input couldn't be converted to EUI because of type mis-match. Should it be text or number? diff --git a/src/core_plugins/metrics/public/components/aggs/series_agg.js b/src/core_plugins/metrics/public/components/aggs/series_agg.js index 6fd85372bf921..3dd14aefcaa4e 100644 --- a/src/core_plugins/metrics/public/components/aggs/series_agg.js +++ b/src/core_plugins/metrics/public/components/aggs/series_agg.js @@ -32,9 +32,10 @@ import { EuiTitle, EuiFormRow, } from '@elastic/eui'; +import { injectI18n, FormattedMessage } from '@kbn/i18n/react'; -function SeriesAgg(props) { - const { panel, model } = props; +function SeriesAggUi(props) { + const { panel, model, intl } = props; const handleChange = createChangeHandler(props.onChange, model); const handleSelectChange = createSelectHandler(handleChange); @@ -42,15 +43,42 @@ function SeriesAgg(props) { const htmlId = htmlIdGenerator(); const functionOptions = [ - { label: 'Sum', value: 'sum' }, - { label: 'Max', value: 'max' }, - { label: 'Min', value: 'min' }, - { label: 'Avg', value: 'mean' }, - { label: 'Overall Sum', value: 'overall_sum' }, - { label: 'Overall Max', value: 'overall_max' }, - { label: 'Overall Min', value: 'overall_min' }, - { label: 'Overall Avg', value: 'overall_avg' }, - { label: 'Cumulative Sum', value: 'cumulative_sum' }, + { + label: intl.formatMessage({ id: 'tsvb.seriesAgg.functionOptions.sumLabel', defaultMessage: 'Sum' }), + value: 'sum' + }, + { + label: intl.formatMessage({ id: 'tsvb.seriesAgg.functionOptions.maxLabel', defaultMessage: 'Max' }), + value: 'max' + }, + { + label: intl.formatMessage({ id: 'tsvb.seriesAgg.functionOptions.minLabel', defaultMessage: 'Min' }), + value: 'min' + }, + { + label: intl.formatMessage({ id: 'tsvb.seriesAgg.functionOptions.avgLabel', defaultMessage: 'Avg' }), + value: 'mean' + }, + { + label: intl.formatMessage({ id: 'tsvb.seriesAgg.functionOptions.overallSumLabel', defaultMessage: 'Overall Sum' }), + value: 'overall_sum' + }, + { + label: intl.formatMessage({ id: 'tsvb.seriesAgg.functionOptions.overallMaxLabel', defaultMessage: 'Overall Max' }), + value: 'overall_max' + }, + { + label: intl.formatMessage({ id: 'tsvb.seriesAgg.functionOptions.overallMinLabel', defaultMessage: 'Overall Min' }), + value: 'overall_min' + }, + { + label: intl.formatMessage({ id: 'tsvb.seriesAgg.functionOptions.overallAvgLabel', defaultMessage: 'Overall Avg' }), + value: 'overall_avg' + }, + { + label: intl.formatMessage({ id: 'tsvb.seriesAgg.functionOptions.cumulativeSumLabel', defaultMessage: 'Cumulative Sum' }), + value: 'cumulative_sum' + }, ]; const selectedFunctionOption = functionOptions.find(option => { return model.function === option.value; @@ -66,7 +94,12 @@ function SeriesAgg(props) { siblings={props.siblings} > - Series Agg is not compatible with the table visualization. + + + ); @@ -82,7 +115,12 @@ function SeriesAgg(props) { > - Aggregation + + + - + )} + > { const handleChange = createChangeHandler(props.onChange, props.model); @@ -57,7 +58,12 @@ export const Static = props => { > - Aggregation + + + { /> - + )} + > - Aggregation + + + - + )} + fullWidth + > { - const { series, panel, fields } = props; +const StandardDeviationAggUi = props => { + const { series, panel, fields, intl } = props; const defaults = { sigma: '' }; const model = { ...defaults, ...props.model }; const modeOptions = [ - { label: 'Raw', value: 'raw' }, - { label: 'Upper Bound', value: 'upper' }, - { label: 'Lower Bound', value: 'lower' }, + { + label: intl.formatMessage({ id: 'tsvb.stdDeviation.modeOptions.rawLabel', defaultMessage: 'Raw' }), + value: 'raw' + }, + { + label: intl.formatMessage({ id: 'tsvb.stdDeviation.modeOptions.upperBoundLabel', defaultMessage: 'Upper Bound' }), + value: 'upper' + }, + { + дabel: intl.formatMessage({ id: 'tsvb.stdDeviation.modeOptions.lowerBoundLabel', defaultMessage: 'Lower Bound' }), + value: 'lower' + }, ]; if (panel.type !== 'table') { - modeOptions.push({ label: 'Bounds Band', value: 'band' }); + modeOptions.push({ + label: intl.formatMessage({ id: 'tsvb.stdDeviation.modeOptions.boundsBandLabel', defaultMessage: 'Bounds Band' }), + value: 'band' + }); } const handleChange = createChangeHandler(props.onChange, model); @@ -70,7 +83,12 @@ export const StandardDeviationAgg = props => { > - Aggregation + + + { /> - + )} + > { - + )} + > { - + )} + > { ); }; -StandardDeviationAgg.propTypes = { +StandardDeviationAggUi.propTypes = { disableDelete: PropTypes.bool, fields: PropTypes.object, model: PropTypes.object, @@ -125,3 +161,5 @@ StandardDeviationAgg.propTypes = { series: PropTypes.object, siblings: PropTypes.array, }; + +export const StandardDeviationAgg = injectI18n(StandardDeviationAggUi); diff --git a/src/core_plugins/metrics/public/components/aggs/std_sibling.js b/src/core_plugins/metrics/public/components/aggs/std_sibling.js index 30232933ffc71..26fd7d8e4a1fe 100644 --- a/src/core_plugins/metrics/public/components/aggs/std_sibling.js +++ b/src/core_plugins/metrics/public/components/aggs/std_sibling.js @@ -34,9 +34,10 @@ import { EuiFormLabel, EuiFormRow, } from '@elastic/eui'; +import { injectI18n, FormattedMessage } from '@kbn/i18n/react'; -export const StandardSiblingAgg = props => { - const { siblings } = props; +const StandardSiblingAggUi = props => { + const { siblings, intl } = props; const defaults = { sigma: '' }; const model = { ...defaults, ...props.model }; const htmlId = htmlIdGenerator(); @@ -49,7 +50,13 @@ export const StandardSiblingAgg = props => { if (model.type === 'std_deviation_bucket') { stdDev.sigma = ( - + )} + > { ); const modeOptions = [ - { label: 'Raw', value: 'raw' }, - { label: 'Upper Bound', value: 'upper' }, - { label: 'Lower Bound', value: 'lower' }, - { label: 'Bounds Band', value: 'band' } + { + label: intl.formatMessage({ id: 'tsvb.stdSibling.modeOptions.rawLabel', defaultMessage: 'Raw' }), + value: 'raw' + }, + { + label: intl.formatMessage({ id: 'tsvb.stdSibling.modeOptions.upperBoundLabel', defaultMessage: 'Upper Bound' }), + value: 'upper' + }, + { + label: intl.formatMessage({ id: 'tsvb.stdSibling.modeOptions.lowerBoundLabel', defaultMessage: 'Lower Bound' }), + value: 'lower' + }, + { + label: intl.formatMessage({ id: 'tsvb.stdSibling.modeOptions.boundsBandLabel', defaultMessage: 'Bounds Band' }), + value: 'band' + } ]; const selectedModeOption = modeOptions.find(option => { return model.mode === option.value; @@ -70,7 +89,13 @@ export const StandardSiblingAgg = props => { stdDev.mode = ( - + )} + > { > - Aggregation + + + { )} > { ); }; -StandardSiblingAgg.propTypes = { +StandardSiblingAggUi.propTypes = { disableDelete: PropTypes.bool, fields: PropTypes.object, model: PropTypes.object, @@ -133,3 +166,5 @@ StandardSiblingAgg.propTypes = { series: PropTypes.object, siblings: PropTypes.array, }; + +export const StandardSiblingAgg = injectI18n(StandardSiblingAggUi); diff --git a/src/core_plugins/metrics/public/components/aggs/top_hit.js b/src/core_plugins/metrics/public/components/aggs/top_hit.js index 06abcfad6039f..46e0b9d14b0ae 100644 --- a/src/core_plugins/metrics/public/components/aggs/top_hit.js +++ b/src/core_plugins/metrics/public/components/aggs/top_hit.js @@ -33,9 +33,10 @@ import { EuiSpacer, EuiFormRow, } from '@elastic/eui'; +import { injectI18n, FormattedMessage } from '@kbn/i18n/react'; -export const TopHitAgg = props => { - const { fields, series, panel } = props; +const TopHitAggUi = props => { + const { fields, series, panel, intl } = props; const defaults = { agg_with: 'avg', size: 1, @@ -51,15 +52,33 @@ export const TopHitAgg = props => { const handleTextChange = createTextHandler(handleChange); const aggWithOptions = [ - { label: 'Avg', value: 'avg' }, - { label: 'Max', value: 'max' }, - { label: 'Min', value: 'min' }, - { label: 'Sum', value: 'sum' }, + { + label: intl.formatMessage({ id: 'tsvb.topHit.aggWithOptions.averageLabel', defaultMessage: 'Avg' }), + value: 'avg', + }, + { + label: intl.formatMessage({ id: 'tsvb.topHit.aggWithOptions.maxLabel', defaultMessage: 'Max' }), + value: 'max' + }, + { + label: intl.formatMessage({ id: 'tsvb.topHit.aggWithOptions.minLabel', defaultMessage: 'Min' }), + value: 'min' + }, + { + label: intl.formatMessage({ id: 'tsvb.topHit.aggWithOptions.sumLabel', defaultMessage: 'Sum' }), + value: 'sum' + }, ]; const orderOptions = [ - { label: 'Asc', value: 'asc' }, - { label: 'Desc', value: 'desc' }, + { + label: intl.formatMessage({ id: 'tsvb.topHit.orderOptions.ascLabel', defaultMessage: 'Asc' }), + value: 'asc' + }, + { + label: intl.formatMessage({ id: 'tsvb.topHit.orderOptions.descLabel', defaultMessage: 'Desc' }), + value: 'desc' + }, ]; const htmlId = htmlIdGenerator(); @@ -79,7 +98,12 @@ export const TopHitAgg = props => { > - Aggregation + + + { /> - + )} + > { - + )} + > {/* EUITODO: The following input couldn't be converted to EUI because of type mis-match. Should it be text or number? @@ -119,10 +155,16 @@ export const TopHitAgg = props => { - + )} + > { - + )} + > { - + )} + > { ); }; + +export const TopHitAgg = injectI18n(TopHitAggUi); diff --git a/src/core_plugins/metrics/public/components/aggs/unsupported_agg.js b/src/core_plugins/metrics/public/components/aggs/unsupported_agg.js index 3c24bc1b5266f..6637538c5ea67 100644 --- a/src/core_plugins/metrics/public/components/aggs/unsupported_agg.js +++ b/src/core_plugins/metrics/public/components/aggs/unsupported_agg.js @@ -20,6 +20,7 @@ import AggRow from './agg_row'; import React from 'react'; import { EuiCode, EuiTitle } from '@elastic/eui'; +import { FormattedMessage } from '@kbn/i18n/react'; export function UnsupportedAgg(props) { return ( @@ -31,7 +32,13 @@ export function UnsupportedAgg(props) { siblings={props.siblings} > - The {props.model.type} aggregation is no longer supported. + + {props.model.type}) }} + /> + ); diff --git a/src/core_plugins/metrics/public/components/aggs/vars.js b/src/core_plugins/metrics/public/components/aggs/vars.js index 1ace6b717aee8..982f7e33ae1dd 100644 --- a/src/core_plugins/metrics/public/components/aggs/vars.js +++ b/src/core_plugins/metrics/public/components/aggs/vars.js @@ -24,8 +24,9 @@ import AddDeleteButtons from '../add_delete_buttons'; import * as collectionActions from '../lib/collection_actions'; import MetricSelect from './metric_select'; import { EuiFlexGroup, EuiFlexItem, EuiFieldText } from '@elastic/eui'; +import { injectI18n } from '@kbn/i18n/react'; -class CalculationVars extends Component { +class CalculationVarsUi extends Component { constructor(props) { super(props); @@ -44,14 +45,15 @@ class CalculationVars extends Component { renderRow(row, i, items) { const handleAdd = collectionActions.handleAdd.bind(null, this.props); const handleDelete = collectionActions.handleDelete.bind(null, this.props, row); + const { intl } = this.props; return ( @@ -91,12 +93,12 @@ class CalculationVars extends Component { } -CalculationVars.defaultProps = { +CalculationVarsUi.defaultProps = { name: 'variables', includeSiblings: false }; -CalculationVars.propTypes = { +CalculationVarsUi.propTypes = { metrics: PropTypes.array, model: PropTypes.object, name: PropTypes.string, @@ -104,4 +106,5 @@ CalculationVars.propTypes = { includeSiblings: PropTypes.bool }; +const CalculationVars = injectI18n(CalculationVarsUi); export default CalculationVars; diff --git a/src/core_plugins/metrics/public/kbn_vis_types/editor_controller.js b/src/core_plugins/metrics/public/kbn_vis_types/editor_controller.js index af40856fb20df..456a52fe3a4cc 100644 --- a/src/core_plugins/metrics/public/kbn_vis_types/editor_controller.js +++ b/src/core_plugins/metrics/public/kbn_vis_types/editor_controller.js @@ -43,7 +43,8 @@ function ReactEditorControllerProvider(Private, config) { appState={params.appState} /> , - this.el); + this.el + ); } resize() { diff --git a/src/core_plugins/metrics/public/kbn_vis_types/index.js b/src/core_plugins/metrics/public/kbn_vis_types/index.js index 9189a0bb93265..27793e22e6cff 100644 --- a/src/core_plugins/metrics/public/kbn_vis_types/index.js +++ b/src/core_plugins/metrics/public/kbn_vis_types/index.js @@ -26,15 +26,16 @@ import { defaultFeedbackMessage } from 'ui/vis/default_feedback_message'; import { VisTypesRegistryProvider } from 'ui/registry/vis_types'; VisTypesRegistryProvider.register(MetricsVisProvider); -export default function MetricsVisProvider(Private) { +export default function MetricsVisProvider(Private, i18n) { const VisFactory = Private(VisFactoryProvider); const ReactEditorController = Private(ReactEditorControllerProvider).handler; const metricsRequestHandler = Private(MetricsRequestHandlerProvider).handler; return VisFactory.createReactVisualization({ name: 'metrics', - title: 'Visual Builder', - description: 'Build time-series using a visual pipeline interface', + title: i18n('tsvb.kbnVisTypes.metricsTitle', { defaultMessage: 'Visual Builder' }), + description: i18n('tsvb.kbnVisTypes.metricsDescription', + { defaultMessage: 'Build time-series using a visual pipeline interface' }), icon: 'visVisualBuilder', feedbackMessage: defaultFeedbackMessage, visConfig: {