[TSVB] Allow custom label for fields via index pattern field management (elastic#84612)

* [TSVB] Allow custom label for fields via index pattern field management

Closes: elastic#84336

* replace saveObject, elasticsearch client to new one

* fix CI

* update schema

* fix Top Hit

* some changes

* partially move getting fields into client side

* fix PR comments

* fix issue with getting fields

* move SanitizedFieldType to common types

* fix issue on changing index pattern

* fix issue

* fix regression

* some work

* remove extractFieldName, createCustomLabelSelectHandler

* request/response processors should be async

* some work

* remove tests for createCustomLabelSelectHandler

* fix table

* fix placeholder

* some work

* fix jest

* fix CI

* fix label for table view

* test: visualize app visual builder switch index patterns should be able to switch between index patterns

* fix functional tests

* fix sorting

* fix labels for entire timerange mode

* add createFieldsFetcher method

* table view - fix pivot label

* fix PR comments

* fix issue with selecting buckets scripts

* fix types

* Update create_select_handler.test.ts

* fix PR comments

Co-authored-by: Kibana Machine <[email protected]>

Author: alexwizp

src/plugins/vis_type_timeseries/common/__snapshots__/model_options.test.js.snap

@@ -18,14 +18,15 @@
  */
 
 import { isBasicAgg } from './agg_lookup';
+import { MetricsItemsSchema } from './types';
 
 describe('aggLookup', () => {
   describe('isBasicAgg(metric)', () => {
     test('returns true for a basic metric (count)', () => {
-      expect(isBasicAgg({ type: 'count' })).toEqual(true);
+      expect(isBasicAgg({ type: 'count' } as MetricsItemsSchema)).toEqual(true);
     });
     test('returns false for a pipeline metric (derivative)', () => {
-      expect(isBasicAgg({ type: 'derivative' })).toEqual(false);
+      expect(isBasicAgg({ type: 'derivative' } as MetricsItemsSchema)).toEqual(false);
     });
   });
 });

src/plugins/vis_type_timeseries/common/agg_lookup.test.js renamed to src/plugins/vis_type_timeseries/common/agg_lookup.test.ts

@@ -17,10 +17,11 @@
  * under the License.
  */
 
-import _ from 'lodash';
+import { omit, pick, includes } from 'lodash';
 import { i18n } from '@kbn/i18n';
+import { MetricsItemsSchema } from './types';
 
-export const lookup = {
+export const lookup: Record<string, string> = {
   count: i18n.translate('visTypeTimeseries.aggLookup.countLabel', { defaultMessage: 'Count' }),
   calculation: i18n.translate('visTypeTimeseries.aggLookup.calculationLabel', {
     defaultMessage: 'Calculation',
@@ -122,11 +123,11 @@ const pipeline = [
 
 const byType = {
   _all: lookup,
-  pipeline: pipeline,
-  basic: _.omit(lookup, pipeline),
-  metrics: _.pick(lookup, ['count', 'avg', 'min', 'max', 'sum', 'cardinality', 'value_count']),
+  pipeline,
+  basic: omit(lookup, pipeline),
+  metrics: pick(lookup, ['count', 'avg', 'min', 'max', 'sum', 'cardinality', 'value_count']),
 };
 
-export function isBasicAgg(item) {
-  return _.includes(Object.keys(byType.basic), item.type);
+export function isBasicAgg(item: MetricsItemsSchema) {
+  return includes(Object.keys(byType.basic), item.type);
 }

src/plugins/vis_type_timeseries/common/agg_lookup.js renamed to src/plugins/vis_type_timeseries/common/agg_lookup.ts

@@ -18,66 +18,79 @@
  */
 
 import { calculateLabel } from './calculate_label';
+import type { MetricsItemsSchema } from './types';
 
 describe('calculateLabel(metric, metrics)', () => {
-  test('returns "Unknown" for empty metric', () => {
-    expect(calculateLabel()).toEqual('Unknown');
-  });
-
   test('returns the metric.alias if set', () => {
-    expect(calculateLabel({ alias: 'Example' })).toEqual('Example');
+    expect(calculateLabel({ alias: 'Example' } as MetricsItemsSchema)).toEqual('Example');
   });
 
   test('returns "Count" for a count metric', () => {
-    expect(calculateLabel({ type: 'count' })).toEqual('Count');
+    expect(calculateLabel({ type: 'count' } as MetricsItemsSchema)).toEqual('Count');
   });
 
   test('returns "Calculation" for a bucket script metric', () => {
-    expect(calculateLabel({ type: 'calculation' })).toEqual('Bucket Script');
+    expect(calculateLabel({ type: 'calculation' } as MetricsItemsSchema)).toEqual('Bucket Script');
   });
 
-  test('returns formated label for series_agg', () => {
-    const label = calculateLabel({ type: 'series_agg', function: 'max' });
+  test('returns formatted label for series_agg', () => {
+    const label = calculateLabel({ type: 'series_agg', function: 'max' } as MetricsItemsSchema);
+
     expect(label).toEqual('Series Agg (max)');
   });
 
-  test('returns formated label for basic aggs', () => {
-    const label = calculateLabel({ type: 'avg', field: 'memory' });
+  test('returns formatted label for basic aggs', () => {
+    const label = calculateLabel({ type: 'avg', field: 'memory' } as MetricsItemsSchema);
+
     expect(label).toEqual('Average of memory');
   });
 
-  test('returns formated label for pipeline aggs', () => {
-    const metric = { id: 2, type: 'derivative', field: 1 };
-    const metrics = [{ id: 1, type: 'max', field: 'network.out.bytes' }, metric];
+  test('returns formatted label for pipeline aggs', () => {
+    const metric = ({ id: 2, type: 'derivative', field: 1 } as unknown) as MetricsItemsSchema;
+    const metrics = ([
+      { id: 1, type: 'max', field: 'network.out.bytes' },
+      metric,
+    ] as unknown) as MetricsItemsSchema[];
     const label = calculateLabel(metric, metrics);
+
     expect(label).toEqual('Derivative of Max of network.out.bytes');
   });
 
-  test('returns formated label for derivative of percentile', () => {
-    const metric = { id: 2, type: 'derivative', field: '1[50.0]' };
-    const metrics = [{ id: 1, type: 'percentile', field: 'network.out.bytes' }, metric];
+  test('returns formatted label for derivative of percentile', () => {
+    const metric = ({
+      id: 2,
+      type: 'derivative',
+      field: '1[50.0]',
+    } as unknown) as MetricsItemsSchema;
+    const metrics = ([
+      { id: 1, type: 'percentile', field: 'network.out.bytes' },
+      metric,
+    ] as unknown) as MetricsItemsSchema[];
     const label = calculateLabel(metric, metrics);
+
     expect(label).toEqual('Derivative of Percentile of network.out.bytes (50.0)');
   });
 
-  test('returns formated label for pipeline aggs (deep)', () => {
-    const metric = { id: 3, type: 'derivative', field: 2 };
-    const metrics = [
+  test('returns formatted label for pipeline aggs (deep)', () => {
+    const metric = ({ id: 3, type: 'derivative', field: 2 } as unknown) as MetricsItemsSchema;
+    const metrics = ([
       { id: 1, type: 'max', field: 'network.out.bytes' },
       { id: 2, type: 'moving_average', field: 1 },
       metric,
-    ];
+    ] as unknown) as MetricsItemsSchema[];
     const label = calculateLabel(metric, metrics);
+
     expect(label).toEqual('Derivative of Moving Average of Max of network.out.bytes');
   });
 
-  test('returns formated label for pipeline aggs uses alias for field metric', () => {
-    const metric = { id: 2, type: 'derivative', field: 1 };
-    const metrics = [
+  test('returns formatted label for pipeline aggs uses alias for field metric', () => {
+    const metric = ({ id: 2, type: 'derivative', field: 1 } as unknown) as MetricsItemsSchema;
+    const metrics = ([
       { id: 1, type: 'max', field: 'network.out.bytes', alias: 'Outbound Traffic' },
       metric,
-    ];
+    ] as unknown) as MetricsItemsSchema[];
     const label = calculateLabel(metric, metrics);
+
     expect(label).toEqual('Derivative of Outbound Traffic');
   });
 });

src/plugins/vis_type_timeseries/common/calculate_label.test.js renamed to src/plugins/vis_type_timeseries/common/calculate_label.test.ts

@@ -18,8 +18,9 @@
  */
 
 import { includes, startsWith } from 'lodash';
-import { lookup } from './agg_lookup';
 import { i18n } from '@kbn/i18n';
+import { lookup } from './agg_lookup';
+import { MetricsItemsSchema, SanitizedFieldType } from './types';
 
 const paths = [
   'cumulative_sum',
@@ -36,7 +37,15 @@ const paths = [
   'positive_only',
 ];
 
-export function calculateLabel(metric, metrics) {
+export const extractFieldLabel = (fields: SanitizedFieldType[], name: string) => {
+  return fields.find((f) => f.name === name)?.label ?? name;
+};
+
+export const calculateLabel = (
+  metric: MetricsItemsSchema,
+  metrics: MetricsItemsSchema[] = [],
+  fields: SanitizedFieldType[] = []
+): string => {
   if (!metric) {
     return i18n.translate('visTypeTimeseries.calculateLabel.unknownLabel', {
       defaultMessage: 'Unknown',
@@ -73,7 +82,7 @@ export function calculateLabel(metric, metrics) {
   if (metric.type === 'positive_rate') {
     return i18n.translate('visTypeTimeseries.calculateLabel.positiveRateLabel', {
       defaultMessage: 'Counter Rate of {field}',
-      values: { field: metric.field },
+      values: { field: extractFieldLabel(fields, metric.field!) },
     });
   }
   if (metric.type === 'static') {
@@ -84,15 +93,15 @@ export function calculateLabel(metric, metrics) {
   }
 
   if (includes(paths, metric.type)) {
-    const targetMetric = metrics.find((m) => startsWith(metric.field, m.id));
-    const targetLabel = calculateLabel(targetMetric, metrics);
+    const targetMetric = metrics.find((m) => startsWith(metric.field!, m.id));
+    const targetLabel = calculateLabel(targetMetric!, metrics, fields);
 
     // For percentiles we need to parse the field id to extract the percentile
     // the user configured in the percentile aggregation and specified in the
     // submetric they selected. This applies only to pipeline aggs.
     if (targetMetric && targetMetric.type === 'percentile') {
       const percentileValueMatch = /\[([0-9\.]+)\]$/;
-      const matches = metric.field.match(percentileValueMatch);
+      const matches = metric.field!.match(percentileValueMatch);
       if (matches) {
         return i18n.translate(
           'visTypeTimeseries.calculateLabel.lookupMetricTypeOfTargetWithAdditionalLabel',
@@ -115,6 +124,9 @@ export function calculateLabel(metric, metrics) {
 
   return i18n.translate('visTypeTimeseries.calculateLabel.lookupMetricTypeOfMetricFieldRankLabel', {
     defaultMessage: '{lookupMetricType} of {metricField}',
-    values: { lookupMetricType: lookup[metric.type], metricField: metric.field },
+    values: {
+      lookupMetricType: lookup[metric.type],
+      metricField: extractFieldLabel(fields, metric.field!),
+    },
   });
-}
+};

src/plugins/vis_type_timeseries/common/calculate_label.js renamed to src/plugins/vis_type_timeseries/common/calculate_label.ts

@@ -18,16 +18,13 @@
  */
 
 import { extractIndexPatterns } from './extract_index_patterns';
+import { PanelSchema } from './types';
 
 describe('extractIndexPatterns(vis)', () => {
-  let visParams;
-  let visFields;
+  let panel: PanelSchema;
 
   beforeEach(() => {
-    visFields = {
-      '*': [],
-    };
-    visParams = {
+    panel = {
       index_pattern: '*',
       series: [
         {
@@ -40,25 +37,10 @@ describe('extractIndexPatterns(vis)', () => {
         },
       ],
       annotations: [{ index_pattern: 'notes-*' }, { index_pattern: 'example-1-*' }],
-    };
+    } as PanelSchema;
   });
 
   test('should return index patterns', () => {
-    visFields = {};
-
-    expect(extractIndexPatterns(visParams, visFields)).toEqual([
-      '*',
-      'example-1-*',
-      'example-2-*',
-      'notes-*',
-    ]);
-  });
-
-  test('should return index patterns that do not exist in visFields', () => {
-    expect(extractIndexPatterns(visParams, visFields)).toEqual([
-      'example-1-*',
-      'example-2-*',
-      'notes-*',
-    ]);
+    expect(extractIndexPatterns(panel, '')).toEqual(['*', 'example-1-*', 'example-2-*', 'notes-*']);
   });
 });

src/plugins/vis_type_timeseries/common/extract_index_patterns.test.js renamed to src/plugins/vis_type_timeseries/common/extract_index_patterns.test.ts

@@ -17,33 +17,37 @@
  * under the License.
  */
 import { uniq } from 'lodash';
+import { PanelSchema } from '../common/types';
 
-export function extractIndexPatterns(panel, excludedFields = {}) {
-  const patterns = [];
+export function extractIndexPatterns(
+  panel: PanelSchema,
+  defaultIndex?: PanelSchema['default_index_pattern']
+) {
+  const patterns: string[] = [];
 
-  if (!excludedFields[panel.index_pattern]) {
+  if (panel.index_pattern) {
     patterns.push(panel.index_pattern);
   }
 
   panel.series.forEach((series) => {
     const indexPattern = series.series_index_pattern;
-    if (indexPattern && series.override_index_pattern && !excludedFields[indexPattern]) {
+    if (indexPattern && series.override_index_pattern) {
       patterns.push(indexPattern);
     }
   });
 
   if (panel.annotations) {
     panel.annotations.forEach((item) => {
       const indexPattern = item.index_pattern;
-      if (indexPattern && !excludedFields[indexPattern]) {
+      if (indexPattern) {
         patterns.push(indexPattern);
       }
     });
   }
 
-  if (patterns.length === 0) {
-    patterns.push('');
+  if (patterns.length === 0 && defaultIndex) {
+    patterns.push(defaultIndex);
   }
 
-  return uniq(patterns).sort();
+  return uniq<string>(patterns).sort();
 }

src/plugins/vis_type_timeseries/common/extract_index_patterns.js renamed to src/plugins/vis_type_timeseries/common/extract_index_patterns.ts

@@ -17,10 +17,10 @@
  * under the License.
  */
 
-export const FIELD_TYPES = {
-  BOOLEAN: 'boolean',
-  DATE: 'date',
-  GEO: 'geo_point',
-  NUMBER: 'number',
-  STRING: 'string',
-};
+export enum FIELD_TYPES {
+  BOOLEAN = 'boolean',
+  DATE = 'date',
+  GEO = 'geo_point',
+  NUMBER = 'number',
+  STRING = 'string',
+}

src/plugins/vis_type_timeseries/common/field_types.js renamed to src/plugins/vis_type_timeseries/common/field_types.ts

@@ -17,10 +17,10 @@
  * under the License.
  */
 
-export const MODEL_TYPES = {
-  UNWEIGHTED: 'simple',
-  WEIGHTED_EXPONENTIAL: 'ewma',
-  WEIGHTED_EXPONENTIAL_DOUBLE: 'holt',
-  WEIGHTED_EXPONENTIAL_TRIPLE: 'holt_winters',
-  WEIGHTED_LINEAR: 'linear',
-};
+export enum MODEL_TYPES {
+  UNWEIGHTED = 'simple',
+  WEIGHTED_EXPONENTIAL = 'ewma',
+  WEIGHTED_EXPONENTIAL_DOUBLE = 'holt',
+  WEIGHTED_EXPONENTIAL_TRIPLE = 'holt_winters',
+  WEIGHTED_LINEAR = 'linear',
+}

src/plugins/vis_type_timeseries/common/model_options.js renamed to src/plugins/vis_type_timeseries/common/model_options.ts

@@ -22,19 +22,19 @@
  * @constant
  * @public
  */
-export const TIME_RANGE_DATA_MODES = {
+export enum TIME_RANGE_DATA_MODES {
   /**
    * Entire timerange mode will match all the documents selected in the
    * timerange timepicker
    */
-  ENTIRE_TIME_RANGE: 'entire_time_range',
+  ENTIRE_TIME_RANGE = 'entire_time_range',
 
   /**
    * Last value mode will match only the documents for the specified interval
    * from the end of the timerange.
    */
-  LAST_VALUE: 'last_value',
-};
+  LAST_VALUE = 'last_value',
+}
 
 /**
  * Key for getting the Time Range mode from the Panel configuration object.