Feature/translate watcher(part_2) (#24017) (#24276)

* translate watcher(pad_2) * fix issues * fix issues
elastic · Oct 20, 2018 · 55881e6 · 55881e6
1 parent c5a7186
commit 55881e6
Show file tree

Hide file tree

Showing 27 changed files with 334 additions and 153 deletions.
diff --git a/...hold_watch_expression/components/threshold_watch_agg_field/threshold_watch_agg_field.html b/...hold_watch_expression/components/threshold_watch_agg_field/threshold_watch_agg_field.html
@@ -16,9 +16,9 @@
  xpack-aria-describes="{{thresholdWatchAggField.makeId('aggField')}}"
  class="kuiInputNote kuiInputNote--danger"
  ng-if="thresholdWatchAggField.isValidationMessageVisible('aggField', 'required')"
- >
- Please select a field.
- </div>
+  i18n-id="xpack.watcher.thresholdWatchExpression.aggType.fieldIsRequiredValidationMessage"
+ i18n-default-message="Please select a field."
+ ></div>
  <select
  id="{{thresholdWatchAggField.makeId('aggField')}}"
  class="kuiSelect"
@@ -27,7 +27,11 @@
  ng-model="thresholdWatchAggField.aggField"
  ng-options="aggField as aggField.name group by aggField.normalizedType for aggField in thresholdWatchAggField.aggFields"
  >
- <option value="">Select a field...</option>
+ <option
+ value=""
+ i18n-id="xpack.watcher.thresholdWatchExpression.aggType.selectFieldDropdownPlaceholder"
+ i18n-default-message="Select a field…"
+ ></option>
  </select>
  </form>
 </expression-item>
diff --git a/...eshold_watch_expression/components/threshold_watch_agg_field/threshold_watch_agg_field.js b/...eshold_watch_expression/components/threshold_watch_agg_field/threshold_watch_agg_field.js
@@ -12,7 +12,7 @@ import 'plugins/watcher/components/xpack_aria_describes';
 
 const app = uiModules.get('xpack/watcher');
 
-app.directive('thresholdWatchAggField', function ($injector) {
+app.directive('thresholdWatchAggField', function ($injector, i18n) {
  const htmlIdGeneratorFactory = $injector.get('xpackWatcherHtmlIdGeneratorFactory');
 
  return {
@@ -51,11 +51,16 @@ app.directive('thresholdWatchAggField', function ($injector) {
  }
  });
 
- this.itemDescription = 'Of';
+ this.itemDescription = i18n('xpack.watcher.thresholdWatchExpression.aggField.itemDescription', {
+ defaultMessage: 'Of',
+ });
  }
 
  get itemValue() {
- return this.aggField ? this.aggField.name : 'select a field';
+ return this.aggField ? this.aggField.name : i18n(
+ 'xpack.watcher.thresholdWatchExpression.aggField.selectFieldTextMessage', {
+ defaultMessage: 'select a field',
+ });
  }
  }
  };

diff --git a/...eshold_watch_expression/components/threshold_watch_agg_type/threshold_watch_agg_type.html b/...eshold_watch_expression/components/threshold_watch_agg_type/threshold_watch_agg_type.html
@@ -16,9 +16,9 @@
  xpack-aria-describes="{{thresholdWatchAggType.makeId('aggType')}}"
  class="kuiInputNote kuiInputNote--danger"
  ng-if="thresholdWatchAggType.isValidationMessageVisible('aggType', 'required')"
- >
- Please select an aggregation type.
- </div>
+  i18n-id="xpack.watcher.thresholdWatchExpression.aggType.requiredTypeValidationMessage"
+ i18n-default-message="Please select an aggregation type."
+ ></div>
  <select
  id="{{thresholdWatchAggType.makeId('aggType')}}"
  class="kuiSelect"

diff --git a/...hreshold_watch_expression/components/threshold_watch_agg_type/threshold_watch_agg_type.js b/...hreshold_watch_expression/components/threshold_watch_agg_type/threshold_watch_agg_type.js
@@ -12,7 +12,7 @@ import 'plugins/watcher/components/xpack_aria_describes';
 
 const app = uiModules.get('xpack/watcher');
 
-app.directive('thresholdWatchAggType', function ($injector) {
+app.directive('thresholdWatchAggType', function ($injector, i18n) {
  const htmlIdGeneratorFactory = $injector.get('xpackWatcherHtmlIdGeneratorFactory');
 
  return {
@@ -43,7 +43,9 @@ app.directive('thresholdWatchAggType', function ($injector) {
  $scope.$watch('thresholdWatchAggType.form.$valid', this.checkValidity);
  $scope.$watch('thresholdWatchAggType.form.$dirty', this.checkDirty);
 
- this.itemDescription = 'When';
+ this.itemDescription = i18n('xpack.watcher.thresholdWatchExpression.aggType.itemDescription', {
+ defaultMessage: 'When',
+ });
  }
 
  get itemValue() {

diff --git a/...eshold_watch_expression/components/threshold_watch_group_by/threshold_watch_group_by.html b/...eshold_watch_expression/components/threshold_watch_group_by/threshold_watch_group_by.html
@@ -16,33 +16,33 @@
  xpack-aria-describes="{{thresholdWatchGroupBy.makeId('termSize')}}"
  class="kuiInputNote kuiInputNote--danger"
  ng-if="thresholdWatchGroupBy.isValidationMessageVisible('termSize', 'required')"
- >
- A value is required.
- </div>
+  i18n-id="xpack.watcher.thresholdWatchExpression.groupBy.requiredValueValidationMessage"
+ i18n-default-message="A value is required."
+ ></div>
  <div
  id="{{thresholdWatchGroupBy.makeId(['termSize', 'number'])}}"
  xpack-aria-describes="{{thresholdWatchGroupBy.makeId('termSize')}}"
  class="kuiInputNote kuiInputNote--danger"
  ng-if="thresholdWatchGroupBy.isValidationMessageVisible('termSize', 'number')"
- >
- Value must be a valid number.
- </div>
+  i18n-id="xpack.watcher.thresholdWatchExpression.groupBy.valueMustBeValidNumberValidationMessage"
+ i18n-default-message="Value must be a valid number."
+ ></div>
  <div
  id="{{thresholdWatchGroupBy.makeId(['termSize', 'min'])}}"
  xpack-aria-describes="{{thresholdWatchGroupBy.makeId('termSize')}}"
  class="kuiInputNote kuiInputNote--danger"
  ng-if="thresholdWatchGroupBy.isValidationMessageVisible('termSize', 'min')"
- >
- Value must be greater than 0.
- </div>
+  i18n-id="xpack.watcher.thresholdWatchExpression.groupBy.valueMustBeGraterThanZeroValidationMessage"
+ i18n-default-message="Value must be greater than 0."
+ ></div>
  <div
  id="{{thresholdWatchGroupBy.makeId(['termField', 'required'])}}"
  xpack-aria-describes="{{thresholdWatchGroupBy.makeId('termField')}}"
  class="kuiInputNote kuiInputNote--danger"
  ng-if="thresholdWatchGroupBy.isValidationMessageVisible('termField', 'required')"
- >
- Please select a field.
- </div>
+  i18n-id="xpack.watcher.thresholdWatchExpression.groupBy.requiredFieldValidationMessage"
+ i18n-default-message="Please select a field."
+ ></div>
  <select
  id="{{thresholdWatchGroupBy.makeId('groupByType')}}"
  class="kuiSelect"
@@ -67,7 +67,11 @@
  ng-options="termField as termField.name group by termField.normalizedType for termField in thresholdWatchGroupBy.termFields"
  ng-if="thresholdWatchGroupBy.groupByType.sizeRequired"
  >
- <option value="">Select a field...</option>
+ <option
+ value=""
+ i18n-id="xpack.watcher.thresholdWatchExpression.groupBy.selectFieldDropdownPlaceholder"
+ i18n-default-message="Select a field…"
+ ></option>
  </select>
  </form>
 </expression-item>
diff --git a/...hreshold_watch_expression/components/threshold_watch_group_by/threshold_watch_group_by.js b/...hreshold_watch_expression/components/threshold_watch_group_by/threshold_watch_group_by.js
@@ -12,7 +12,7 @@ import 'plugins/watcher/components/xpack_aria_describes';
 
 const app = uiModules.get('xpack/watcher');
 
-app.directive('thresholdWatchGroupBy', function ($injector) {
+app.directive('thresholdWatchGroupBy', function ($injector, i18n) {
  const htmlIdGeneratorFactory = $injector.get('xpackWatcherHtmlIdGeneratorFactory');
 
  return {
@@ -57,7 +57,15 @@ app.directive('thresholdWatchGroupBy', function ($injector) {
  }
 
  get itemDescription() {
- return (this.groupByType && this.groupByType.sizeRequired) ? 'Grouped over' : 'Over';
+ const itemDescription = (this.groupByType && this.groupByType.sizeRequired)
+ ? i18n('xpack.watcher.thresholdWatchExpression.groupBy.groupedItemDescription', {
+ defaultMessage: 'Grouped over',
+ })
+ : i18n('xpack.watcher.thresholdWatchExpression.groupBy.itemDescription', {
+ defaultMessage: 'Over',
+ });
+
+ return itemDescription;
  }
 
  get itemValue() {

diff --git a/...xpression/components/threshold_watch_threshold_level/threshold_watch_threshold_level.html b/...xpression/components/threshold_watch_threshold_level/threshold_watch_threshold_level.html
@@ -16,17 +16,17 @@
  xpack-aria-describes="{{thresholdWatchThresholdLevel.makeId('threshold')}}"
  class="kuiInputNote kuiInputNote--danger"
  ng-if="thresholdWatchThresholdLevel.isValidationMessageVisible('threshold', 'required')"
- >
- A value is required.
- </div>
+  i18n-id="xpack.watcher.thresholdWatchExpression.thresholdLevel.valueIsRequiredValidationMessage"
+ i18n-default-message="A value is required."
+ ></div>
  <div
  id="{{thresholdWatchThresholdLevel.makeId(['threshold', 'number'])}}"
  xpack-aria-describes="{{thresholdWatchThresholdLevel.makeId('threshold')}}"
  class="kuiInputNote kuiInputNote--danger"
  ng-if="thresholdWatchThresholdLevel.isValidationMessageVisible('threshold', 'number')"
- >
- Value must be a valid number.
- </div>
+  i18n-id="xpack.watcher.thresholdWatchExpression.thresholdLevel.valueMustBeValidNumberValidationMessage"
+ i18n-default-message="Value must be a valid number."
+ ></div>
  <select
  id="{{thresholdWatchThresholdLevel.makeId('thresholdComparator')}}"
  name="thresholdComparator"

diff --git a/..._watch_expression/components/threshold_watch_time_window/threshold_watch_time_window.html b/..._watch_expression/components/threshold_watch_time_window/threshold_watch_time_window.html
@@ -16,42 +16,42 @@
  xpack-aria-describes="durationSelectWindowSize"
  class="kuiInputNote kuiInputNote--danger"
  ng-if="thresholdWatchTimeWindow.isValidationMessageVisible('durationSelectWindowSize', 'required')"
- >
- Window duration size is required.
- </div>
+  i18n-id="xpack.watcher.thresholdWatchExpression.timeWindow.durationSizeIsRequiredValidationMessage"
+ i18n-default-message="Window duration size is required."
+ ></div>
  <div
  id="{{thresholdWatchTimeWindow.makeId(['durationSelectWindowSize', 'min'])}}"
  aria-describes="durationSelectWindowSize"
  class="kuiInputNote kuiInputNote--danger"
  ng-if="thresholdWatchTimeWindow.isValidationMessageVisible('durationSelectWindowSize', 'min')"
- >
- Window duration size can not be a negative number.
- </div>
+  i18n-id="xpack.watcher.thresholdWatchExpression.timeWindow.durationSizeMustBePositiveNumberValidationMessage"
+ i18n-default-message="Window duration size can not be a negative number."
+ ></div>
  <div
  id="{{thresholdWatchTimeWindow.makeId(['durationSelectWindowSize', 'number'])}}"
  xpack-aria-describes="durationSelectWindowSize"
  class="kuiInputNote kuiInputNote--danger"
  ng-if="thresholdWatchTimeWindow.isValidationMessageVisible('durationSelectWindowSize', 'number')"
- >
- Window duration size must be a valid number.
- </div>
+  i18n-id="xpack.watcher.thresholdWatchExpression.timeWindow.durationSizeMustBeValidNumberValidationMessage"
+ i18n-default-message="Window duration size must be a valid number."
+ ></div>
  <div
  id="{{thresholdWatchTimeWindow.makeId(['durationSelectWindowUnit', 'required'])}}"
  xpack-aria-describes="durationSelectWindowUnit"
  class="kuiInputNote kuiInputNote--danger"
  ng-if="thresholdWatchTimeWindow.isValidationMessageVisible('durationSelectWindowUnit', 'required')"
- >
- Window duration unit is required.
- </div>
+  i18n-id="xpack.watcher.thresholdWatchExpression.timeWindow.durationUnitIsRequiredValidationMessage"
+ i18n-default-message="Window duration unit is required."
+ ></div>
  <div
  id="{{thresholdWatchTimeWindow.makeId(['durationSelectWindowSize', 'minimumDuration'])}}"
  xpack-aria-describes="durationSelectWindowSize durationSelectWindowUnit"
  class="kuiInputNote kuiInputNote--danger"
  ng-if="thresholdWatchTimeWindow.isValidationMessageVisible('durationSelectWindowSize', 'minimumDuration', false)"
- >
- Window duration is too short.
- The minimum allowed is {{thresholdWatchTimeWindow.timeWindowMinimumSize}}{{thresholdWatchTimeWindow.timeWindowMinimumUnit}}.
- </div>
+  i18n-id="xpack.watcher.thresholdWatchExpression.timeWindow.durationIsTooShortValidationMessage"
+ i18n-default-message="Window duration is too short. The minimum allowed is {minimumSize}{minimumUnit}."
+ i18n-values="{ minimumSize: thresholdWatchTimeWindow.timeWindowMinimumSize, minimumUnit: thresholdWatchTimeWindow.timeWindowMinimumUnit }"
+ ></div>
  <duration-select
  duration-id="window"
  minimum-unit="thresholdWatchTimeWindow.timeWindowMinimumUnit"

diff --git a/...ld_watch_expression/components/threshold_watch_time_window/threshold_watch_time_window.js b/...ld_watch_expression/components/threshold_watch_time_window/threshold_watch_time_window.js
@@ -15,7 +15,7 @@ import 'plugins/watcher/components/xpack_aria_describes';
 
 const app = uiModules.get('xpack/watcher');
 
-app.directive('thresholdWatchTimeWindow', function ($injector) {
+app.directive('thresholdWatchTimeWindow', function ($injector, i18n) {
  const htmlIdGeneratorFactory = $injector.get('xpackWatcherHtmlIdGeneratorFactory');
 
  return {
@@ -55,7 +55,9 @@ app.directive('thresholdWatchTimeWindow', function ($injector) {
  }
 
  get itemDescription() {
- return 'For the last';
+ return i18n('xpack.watcher.thresholdWatchExpression.timeWindow.itemDescription', {
+ defaultMessage: 'For the last',
+ });
  }
 
  get itemValue() {

diff --git a/x-pack/plugins/watcher/public/components/threshold_watch_expression/lib/comparators.js b/x-pack/plugins/watcher/public/components/threshold_watch_expression/lib/comparators.js
@@ -4,15 +4,21 @@
  * you may not use this file except in compliance with the Elastic License.
  */
 
+import { i18n } from '@kbn/i18n';
+
 import { COMPARATORS } from 'plugins/watcher/../common/constants';
 
 export const comparators = {
  'above': {
- label: 'Is above',
+ label: i18n.translate('xpack.watcher.thresholdWatchExpression.comparators.isAboveLabel', {
+ defaultMessage: 'Is above',
+ }),
  value: COMPARATORS.GREATER_THAN
  },
  'below': {
- label: 'Is below',
+ label: i18n.translate('xpack.watcher.thresholdWatchExpression.comparators.isBelowLabel', {
+ defaultMessage: 'Is below',
+ }),
  value: COMPARATORS.LESS_THAN
  }
 };
diff --git a/x-pack/plugins/watcher/public/components/threshold_watch_expression/lib/group_by_types.js b/x-pack/plugins/watcher/public/components/threshold_watch_expression/lib/group_by_types.js
@@ -4,15 +4,21 @@
  * you may not use this file except in compliance with the Elastic License.
  */
 
+import { i18n } from '@kbn/i18n';
+
 export const groupByTypes = {
  'all': {
- label: 'all documents',
+ label: i18n.translate('xpack.watcher.thresholdWatchExpression.groupByLabel.allDocumentsLabel', {
+ defaultMessage: 'all documents',
+ }),
  sizeRequired: false,
  value: 'all',
  validNormalizedTypes: []
  },
  'top': {
- label: 'top',
+ label: i18n.translate('xpack.watcher.thresholdWatchExpression.groupByLabel.topLabel', {
+ defaultMessage: 'top',
+ }),
  sizeRequired: true,
  value: 'top',
  validNormalizedTypes: ['number', 'date', 'keyword']

diff --git a/x-pack/plugins/watcher/public/components/threshold_watch_expression/lib/time_units.js b/x-pack/plugins/watcher/public/components/threshold_watch_expression/lib/time_units.js
@@ -4,25 +4,43 @@
  * you may not use this file except in compliance with the Elastic License.
  */
 
+import { i18n } from '@kbn/i18n';
+
 export const timeUnits = {
  'second': {
- labelPlural: 'seconds',
- labelSingular: 'second',
+ labelPlural: i18n.translate('xpack.watcher.thresholdWatchExpression.timeUnits.secondPluralLabel', {
+ defaultMessage: 'seconds',
+ }),
+ labelSingular: i18n.translate('xpack.watcher.thresholdWatchExpression.timeUnits.secondSingularLabel', {
+ defaultMessage: 'second',
+ }),
  value: 's'
  },
  'minute': {
- labelPlural: 'minutes',
- labelSingular: 'minute',
+ labelPlural: i18n.translate('xpack.watcher.thresholdWatchExpression.timeUnits.minutePluralLabel', {
+ defaultMessage: 'minutes',
+ }),
+ labelSingular: i18n.translate('xpack.watcher.thresholdWatchExpression.timeUnits.minuteSingularLabel', {
+ defaultMessage: 'minute',
+ }),
  value: 'm'
  },
  'hour': {
- labelPlural: 'hours',
- labelSingular: 'hour',
+ labelPlural: i18n.translate('xpack.watcher.thresholdWatchExpression.timeUnits.hourPluralLabel', {
+ defaultMessage: 'hours',
+ }),
+ labelSingular: i18n.translate('xpack.watcher.thresholdWatchExpression.timeUnits.hourSingularLabel', {
+ defaultMessage: 'hour',
+ }),
  value: 'h'
  },
  'day': {
- labelPlural: 'days',
- labelSingular: 'day',
+ labelPlural: i18n.translate('xpack.watcher.thresholdWatchExpression.timeUnits.dayPluralLabel', {
+ defaultMessage: 'days',
+ }),
+ labelSingular: i18n.translate('xpack.watcher.thresholdWatchExpression.timeUnits.daySingularLabel', {
+ defaultMessage: 'day',
+ }),
  value: 'd'
  }
 };
diff --git a/...gins/watcher/public/components/threshold_watch_expression/threshold_watch_expression.html b/...gins/watcher/public/components/threshold_watch_expression/threshold_watch_expression.html
@@ -2,9 +2,9 @@
  <div
  class="kuiInputNote kuiInputNote--danger"
  ng-show="thresholdWatchExpression.showExpressionValidation()"
- >
- Please fix the errors in the expression below.
- </div>
+  i18n-id="xpack.watcher.thresholdWatchExpression.fixErrorInExpressionBelowValidationMessage"
+ i18n-default-message="Please fix the errors in the expression below."
+ ></div>
 
  <threshold-watch-agg-type
  item-id="agg-type"

diff --git a/...ck/plugins/watcher/public/components/tool_bar_selected_count/tool_bar_selected_count.html b/...ck/plugins/watcher/public/components/tool_bar_selected_count/tool_bar_selected_count.html
@@ -1,3 +1,4 @@
 <div class="kuiToolBarText">
- {{ toolBarSelectedCount.count }} {{ toolBarSelectedCount.count === 1 ? toolBarSelectedCount.singularName : toolBarSelectedCount.pluralName}} selected
+ {{ toolBarSelectedCount.count }} {{ toolBarSelectedCount.count === 1 ? toolBarSelectedCount.singularName : toolBarSelectedCount.pluralName}}
+ {{ 'xpack.watcher.toolBarSelectedCountText' | i18n: { defaultMessage: 'selected' } }}
 </div>