[XY] Usable reference lines for xyVis. (#132192)

* ReferenceLineLayer -> referenceLine.

* Added the referenceLine and splitted the logic at ReferenceLineAnnotations.

* Fixed formatters of referenceLines

* Added referenceLines keys.

* Added test for the referenceLine fn.

* Added some tests for reference_lines.

* Unified the two different approaches of referenceLines.

* Fixed types at tests and limits.

packages/kbn-optimizer/limits.yml

@@ -128,5 +128,5 @@ pageLoadAssetSize:
   eventAnnotation: 19334
   screenshotting: 22870
   synthetics: 40958
-  expressionXY: 31000
+  expressionXY: 33000
   kibanaUsageCollection: 16463

src/plugins/chart_expressions/expression_xy/common/constants.ts

@@ -9,6 +9,7 @@
 export const XY_VIS = 'xyVis';
 export const LAYERED_XY_VIS = 'layeredXyVis';
 export const Y_CONFIG = 'yConfig';
+export const REFERENCE_LINE_Y_CONFIG = 'referenceLineYConfig';
 export const EXTENDED_Y_CONFIG = 'extendedYConfig';
 export const DATA_LAYER = 'dataLayer';
 export const EXTENDED_DATA_LAYER = 'extendedDataLayer';
@@ -19,8 +20,8 @@ export const ANNOTATION_LAYER = 'annotationLayer';
 export const EXTENDED_ANNOTATION_LAYER = 'extendedAnnotationLayer';
 export const TICK_LABELS_CONFIG = 'tickLabelsConfig';
 export const AXIS_EXTENT_CONFIG = 'axisExtentConfig';
+export const REFERENCE_LINE = 'referenceLine';
 export const REFERENCE_LINE_LAYER = 'referenceLineLayer';
-export const EXTENDED_REFERENCE_LINE_LAYER = 'extendedReferenceLineLayer';
 export const LABELS_ORIENTATION_CONFIG = 'labelsOrientationConfig';
 export const AXIS_TITLES_VISIBILITY_CONFIG = 'axisTitlesVisibilityConfig';
 

src/plugins/chart_expressions/expression_xy/common/expression_functions/index.ts

@@ -18,6 +18,6 @@ export * from './grid_lines_config';
 export * from './axis_extent_config';
 export * from './tick_labels_config';
 export * from './labels_orientation_config';
+export * from './reference_line';
 export * from './reference_line_layer';
-export * from './extended_reference_line_layer';
 export * from './axis_titles_visibility_config';

src/plugins/chart_expressions/expression_xy/common/expression_functions/layered_xy_vis.ts

@@ -6,10 +6,11 @@
  * Side Public License, v 1.
  */
 
+import { i18n } from '@kbn/i18n';
 import { LayeredXyVisFn } from '../types';
 import {
   EXTENDED_DATA_LAYER,
-  EXTENDED_REFERENCE_LINE_LAYER,
+  REFERENCE_LINE_LAYER,
   LAYERED_XY_VIS,
   EXTENDED_ANNOTATION_LAYER,
 } from '../constants';
@@ -24,8 +25,10 @@ export const layeredXyVisFunction: LayeredXyVisFn = {
   args: {
     ...commonXYArgs,
     layers: {
-      types: [EXTENDED_DATA_LAYER, EXTENDED_REFERENCE_LINE_LAYER, EXTENDED_ANNOTATION_LAYER],
-      help: strings.getLayersHelp(),
+      types: [EXTENDED_DATA_LAYER, REFERENCE_LINE_LAYER, EXTENDED_ANNOTATION_LAYER],
+      help: i18n.translate('expressionXY.layeredXyVis.layers.help', {
+        defaultMessage: 'Layers of visual series',
+      }),
       multi: true,
     },
   },

src/plugins/chart_expressions/expression_xy/common/expression_functions/reference_line.test.ts

@@ -0,0 +1,140 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0 and the Server Side Public License, v 1; you may not use this file except
+ * in compliance with, at your election, the Elastic License 2.0 or the Server
+ * Side Public License, v 1.
+ */
+
+import { createMockExecutionContext } from '@kbn/expressions-plugin/common/mocks';
+import { ReferenceLineArgs, ReferenceLineConfigResult } from '../types';
+import { referenceLineFunction } from './reference_line';
+
+describe('referenceLine', () => {
+  test('produces the correct arguments for minimum arguments', async () => {
+    const args: ReferenceLineArgs = {
+      value: 100,
+    };
+
+    const result = referenceLineFunction.fn(null, args, createMockExecutionContext());
+
+    const expectedResult: ReferenceLineConfigResult = {
+      type: 'referenceLine',
+      layerType: 'referenceLine',
+      lineLength: 0,
+      yConfig: [
+        {
+          type: 'referenceLineYConfig',
+          ...args,
+          textVisibility: false,
+        },
+      ],
+    };
+    expect(result).toEqual(expectedResult);
+  });
+
+  test('produces the correct arguments for maximum arguments', async () => {
+    const args: ReferenceLineArgs = {
+      name: 'some value',
+      value: 100,
+      icon: 'alert',
+      iconPosition: 'below',
+      axisMode: 'bottom',
+      lineStyle: 'solid',
+      lineWidth: 10,
+      color: '#fff',
+      fill: 'below',
+      textVisibility: true,
+    };
+
+    const result = referenceLineFunction.fn(null, args, createMockExecutionContext());
+
+    const expectedResult: ReferenceLineConfigResult = {
+      type: 'referenceLine',
+      layerType: 'referenceLine',
+      lineLength: 0,
+      yConfig: [
+        {
+          type: 'referenceLineYConfig',
+          ...args,
+        },
+      ],
+    };
+    expect(result).toEqual(expectedResult);
+  });
+
+  test('adds text visibility if name is provided ', async () => {
+    const args: ReferenceLineArgs = {
+      name: 'some name',
+      value: 100,
+    };
+
+    const result = referenceLineFunction.fn(null, args, createMockExecutionContext());
+
+    const expectedResult: ReferenceLineConfigResult = {
+      type: 'referenceLine',
+      layerType: 'referenceLine',
+      lineLength: 0,
+      yConfig: [
+        {
+          type: 'referenceLineYConfig',
+          ...args,
+          textVisibility: true,
+        },
+      ],
+    };
+    expect(result).toEqual(expectedResult);
+  });
+
+  test('hides text if textVisibility is true and no text is provided', async () => {
+    const args: ReferenceLineArgs = {
+      value: 100,
+      textVisibility: true,
+    };
+
+    const result = referenceLineFunction.fn(null, args, createMockExecutionContext());
+
+    const expectedResult: ReferenceLineConfigResult = {
+      type: 'referenceLine',
+      layerType: 'referenceLine',
+      lineLength: 0,
+      yConfig: [
+        {
+          type: 'referenceLineYConfig',
+          ...args,
+          textVisibility: false,
+        },
+      ],
+    };
+    expect(result).toEqual(expectedResult);
+  });
+
+  test('applies text visibility if name is provided', async () => {
+    const checktextVisibility = (textVisibility: boolean = false) => {
+      const args: ReferenceLineArgs = {
+        value: 100,
+        name: 'some text',
+        textVisibility,
+      };
+
+      const result = referenceLineFunction.fn(null, args, createMockExecutionContext());
+
+      const expectedResult: ReferenceLineConfigResult = {
+        type: 'referenceLine',
+        layerType: 'referenceLine',
+        lineLength: 0,
+        yConfig: [
+          {
+            type: 'referenceLineYConfig',
+            ...args,
+            textVisibility,
+          },
+        ],
+      };
+      expect(result).toEqual(expectedResult);
+    };
+
+    checktextVisibility();
+    checktextVisibility(true);
+  });
+});

src/plugins/chart_expressions/expression_xy/common/expression_functions/reference_line.ts

@@ -0,0 +1,114 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0 and the Server Side Public License, v 1; you may not use this file except
+ * in compliance with, at your election, the Elastic License 2.0 or the Server
+ * Side Public License, v 1.
+ */
+
+import { i18n } from '@kbn/i18n';
+import {
+  AvailableReferenceLineIcons,
+  FillStyles,
+  IconPositions,
+  LayerTypes,
+  LineStyles,
+  REFERENCE_LINE,
+  REFERENCE_LINE_Y_CONFIG,
+  YAxisModes,
+} from '../constants';
+import { ReferenceLineFn } from '../types';
+import { strings } from '../i18n';
+
+export const referenceLineFunction: ReferenceLineFn = {
+  name: REFERENCE_LINE,
+  aliases: [],
+  type: REFERENCE_LINE,
+  help: strings.getRLHelp(),
+  inputTypes: ['datatable', 'null'],
+  args: {
+    name: {
+      types: ['string'],
+      help: strings.getReferenceLineNameHelp(),
+    },
+    value: {
+      types: ['number'],
+      help: strings.getReferenceLineValueHelp(),
+      required: true,
+    },
+    axisMode: {
+      types: ['string'],
+      options: [...Object.values(YAxisModes)],
+      help: strings.getAxisModeHelp(),
+      default: YAxisModes.AUTO,
+      strict: true,
+    },
+    color: {
+      types: ['string'],
+      help: strings.getColorHelp(),
+    },
+    lineStyle: {
+      types: ['string'],
+      options: [...Object.values(LineStyles)],
+      help: i18n.translate('expressionXY.yConfig.lineStyle.help', {
+        defaultMessage: 'The style of the reference line',
+      }),
+      default: LineStyles.SOLID,
+      strict: true,
+    },
+    lineWidth: {
+      types: ['number'],
+      help: i18n.translate('expressionXY.yConfig.lineWidth.help', {
+        defaultMessage: 'The width of the reference line',
+      }),
+      default: 1,
+    },
+    icon: {
+      types: ['string'],
+      help: i18n.translate('expressionXY.yConfig.icon.help', {
+        defaultMessage: 'An optional icon used for reference lines',
+      }),
+      options: [...Object.values(AvailableReferenceLineIcons)],
+      strict: true,
+    },
+    iconPosition: {
+      types: ['string'],
+      options: [...Object.values(IconPositions)],
+      help: i18n.translate('expressionXY.yConfig.iconPosition.help', {
+        defaultMessage: 'The placement of the icon for the reference line',
+      }),
+      default: IconPositions.AUTO,
+      strict: true,
+    },
+    textVisibility: {
+      types: ['boolean'],
+      help: i18n.translate('expressionXY.yConfig.textVisibility.help', {
+        defaultMessage: 'Visibility of the label on the reference line',
+      }),
+    },
+    fill: {
+      types: ['string'],
+      options: [...Object.values(FillStyles)],
+      help: i18n.translate('expressionXY.yConfig.fill.help', {
+        defaultMessage: 'Fill',
+      }),
+      default: FillStyles.NONE,
+      strict: true,
+    },
+  },
+  fn(table, args) {
+    const textVisibility =
+      args.name !== undefined && args.textVisibility === undefined
+        ? true
+        : args.name === undefined
+        ? false
+        : args.textVisibility;
+
+    return {
+      type: REFERENCE_LINE,
+      layerType: LayerTypes.REFERENCELINE,
+      lineLength: table?.rows.length ?? 0,
+      yConfig: [{ ...args, textVisibility, type: REFERENCE_LINE_Y_CONFIG }],
+    };
+  },
+};