[XY] Migrate vis type xy to new unified xy expression (elastic#136475)

* Migrate vis type xy to new unified xy expression * Add legend toggle and color picker. Some fixes * Fix snapshots * Fix tests * Fix some tests * Fix snapshots * Fix tests * Fix some tests * Fix some tests * Fix some more tests * Update snapshot for area chart * Fix dashboards tests * Fix test * Fix some remarks * Fix tests * Fix test * Remove useAdjustedInterval arg * Fix remarks * Fix CI checks * [CI] Auto-commit changed files from 'node scripts/eslint --no-cache --fix' * Fix CI * [CI] Auto-commit changed files from 'node scripts/precommit_hook.js --ref HEAD~1..HEAD --fix' * Fix all remarks * Remove unused code * Fix Percentile aggragtion * Fix problems with several series * Fix problems with hidden series Co-authored-by: Joe Reuter <johannes.reuter@elastic.co> Co-authored-by: Kibana Machine <42973632+kibanamachine@users.noreply.github.com> Co-authored-by: Stratoula Kalafateli <efstratia.kalafateli@elastic.co>
Mpdreamz · Sep 6, 2022 · 45bb4a4 · 45bb4a4
1 parent a2da922
commit 45bb4a4
Show file tree

Hide file tree

Showing 51 changed files with 10,969 additions and 8,009 deletions.
diff --git a/src/plugins/chart_expressions/expression_xy/common/constants.ts b/src/plugins/chart_expressions/expression_xy/common/constants.ts
@@ -35,6 +35,8 @@ export const FittingFunctions = {
   LINEAR: 'Linear',
   CARRY: 'Carry',
   LOOKAHEAD: 'Lookahead',
+  AVERAGE: 'Average',
+  NEAREST: 'Nearest',
 } as const;
 
 export const EndValues = {
@@ -60,6 +62,7 @@ export const LineStyles = {
   SOLID: 'solid',
   DASHED: 'dashed',
   DOTTED: 'dotted',
+  DOT_DASHED: 'dot-dashed',
 } as const;
 
 export const FillStyles = {
@@ -98,6 +101,7 @@ export const XScaleTypes = {
 export const XYCurveTypes = {
   LINEAR: 'LINEAR',
   CURVE_MONOTONE_X: 'CURVE_MONOTONE_X',
+  CURVE_STEP_AFTER: 'CURVE_STEP_AFTER',
 } as const;
 
 export const ValueLabelModes = {

diff --git a/...plugins/chart_expressions/expression_xy/common/expression_functions/axis_extent_config.ts b/...plugins/chart_expressions/expression_xy/common/expression_functions/axis_extent_config.ts
@@ -53,6 +53,12 @@ export const axisExtentConfigFunction: ExpressionFunctionDefinition<
         defaultMessage: 'Upper bound',
       }),
     },
+    enforce: {
+      types: ['boolean'],
+      help: i18n.translate('expressionXY.axisExtentConfig.enforce.help', {
+        defaultMessage: 'Enforce extent params.',
+      }),
+    },
   },
   fn(input, args) {
     if (args.mode === AxisExtentModes.CUSTOM) {

diff --git a/...ins/chart_expressions/expression_xy/common/expression_functions/common_data_layer_args.ts b/...ins/chart_expressions/expression_xy/common/expression_functions/common_data_layer_args.ts
@@ -7,7 +7,7 @@
  */
 
 import { ArgumentType } from '@kbn/expressions-plugin/common';
-import { SeriesTypes, XScaleTypes, DATA_DECORATION_CONFIG } from '../constants';
+import { SeriesTypes, XScaleTypes, DATA_DECORATION_CONFIG, XYCurveTypes } from '../constants';
 import { strings } from '../i18n';
 import { DataLayerArgs, ExtendedDataLayerArgs } from '../types';
 
@@ -58,6 +58,12 @@ export const commonDataLayerArgs: Omit<
     default: false,
     help: strings.getIsHorizontalHelp(),
   },
+  curveType: {
+    types: ['string'],
+    options: [...Object.values(XYCurveTypes)],
+    help: strings.getCurveTypeHelp(),
+    strict: true,
+  },
   lineWidth: {
     types: ['number'],
     help: strings.getLineWidthHelp(),

diff --git a/src/plugins/chart_expressions/expression_xy/common/expression_functions/common_xy_args.ts b/src/plugins/chart_expressions/expression_xy/common/expression_functions/common_xy_args.ts
@@ -11,7 +11,6 @@ import {
   FittingFunctions,
   LEGEND_CONFIG,
   ValueLabelModes,
-  XYCurveTypes,
   X_AXIS_CONFIG,
   Y_AXIS_CONFIG,
 } from '../constants';
@@ -50,12 +49,6 @@ export const commonXYArgs: CommonXYFn['args'] = {
     strict: true,
     default: ValueLabelModes.HIDE,
   },
-  curveType: {
-    types: ['string'],
-    options: [...Object.values(XYCurveTypes)],
-    help: strings.getCurveTypeHelp(),
-    strict: true,
-  },
   fillOpacity: {
     types: ['number'],
     help: strings.getFillOpacityHelp(),

diff --git a/...lugins/chart_expressions/expression_xy/common/expression_functions/extended_data_layer.ts b/...lugins/chart_expressions/expression_xy/common/expression_functions/extended_data_layer.ts
@@ -20,27 +20,23 @@ export const extendedDataLayerFunction: ExtendedDataLayerFn = {
   args: {
     ...commonDataLayerArgs,
     xAccessor: {
-      types: ['string'],
+      types: ['vis_dimension', 'string'],
       help: strings.getXAccessorHelp(),
     },
     splitAccessors: {
-      types: ['string'],
+      types: ['vis_dimension', 'string'],
       help: strings.getSplitAccessorHelp(),
       multi: true,
     },
     accessors: {
-      types: ['string'],
+      types: ['vis_dimension', 'string'],
       help: strings.getAccessorsHelp(),
       multi: true,
     },
     markSizeAccessor: {
-      types: ['string'],
+      types: ['vis_dimension', 'string'],
       help: strings.getMarkSizeAccessorHelp(),
     },
-    table: {
-      types: ['datatable'],
-      help: strings.getTableHelp(),
-    },
     layerId: {
       types: ['string'],
       help: strings.getLayerIdHelp(),

diff --git a/...ins/chart_expressions/expression_xy/common/expression_functions/extended_data_layer_fn.ts b/...ins/chart_expressions/expression_xy/common/expression_functions/extended_data_layer_fn.ts
@@ -6,6 +6,7 @@
  * Side Public License, v 1.
  */
 
+import { ExpressionValueVisDimension } from '@kbn/visualizations-plugin/common';
 import { validateAccessor } from '@kbn/visualizations-plugin/common/utils';
 import { ExtendedDataLayerArgs, ExtendedDataLayerFn } from '../types';
 import { EXTENDED_DATA_LAYER, LayerTypes } from '../constants';
@@ -19,8 +20,11 @@ import {
 } from './validate';
 
 export const extendedDataLayerFn: ExtendedDataLayerFn['fn'] = async (data, args, context) => {
-  const table = args.table ?? data;
-  const accessors = getAccessors<string, ExtendedDataLayerArgs>(args, table);
+  const table = data;
+  const accessors = getAccessors<string | ExpressionValueVisDimension, ExtendedDataLayerArgs>(
+    args,
+    table
+  );
 
   validateAccessor(accessors.xAccessor, table.columns);
   accessors.splitAccessors?.forEach((accessor) => validateAccessor(accessor, table.columns));

diff --git a/src/plugins/chart_expressions/expression_xy/common/expression_functions/layered_xy_vis.ts b/src/plugins/chart_expressions/expression_xy/common/expression_functions/layered_xy_vis.ts
@@ -13,6 +13,7 @@ import {
   REFERENCE_LINE_LAYER,
   LAYERED_XY_VIS,
   EXTENDED_ANNOTATION_LAYER,
+  REFERENCE_LINE,
 } from '../constants';
 import { commonXYArgs } from './common_xy_args';
 import { strings } from '../i18n';
@@ -25,12 +26,27 @@ export const layeredXyVisFunction: LayeredXyVisFn = {
   args: {
     ...commonXYArgs,
     layers: {
-      types: [EXTENDED_DATA_LAYER, REFERENCE_LINE_LAYER, EXTENDED_ANNOTATION_LAYER],
+      types: [EXTENDED_DATA_LAYER, REFERENCE_LINE_LAYER, EXTENDED_ANNOTATION_LAYER, REFERENCE_LINE],
       help: i18n.translate('expressionXY.layeredXyVis.layers.help', {
         defaultMessage: 'Layers of visual series',
       }),
       multi: true,
     },
+    splitColumnAccessor: {
+      types: ['vis_dimension', 'string'],
+      help: strings.getSplitColumnAccessorHelp(),
+    },
+    splitRowAccessor: {
+      types: ['vis_dimension', 'string'],
+      help: strings.getSplitRowAccessorHelp(),
+    },
+    singleTable: {
+      types: ['boolean'],
+      help: i18n.translate('expressionXY.layeredXyVis.singleTable.help', {
+        defaultMessage: 'All layers use the one datatable',
+      }),
+      default: false,
+    },
   },
   async fn(data, args, handlers) {
     const { layeredXyVisFn } = await import('./layered_xy_vis_fn');

diff --git a/src/plugins/chart_expressions/expression_xy/common/expression_functions/layered_xy_vis_fn.ts b/src/plugins/chart_expressions/expression_xy/common/expression_functions/layered_xy_vis_fn.ts
@@ -8,7 +8,7 @@
 
 import { XY_VIS_RENDERER } from '../constants';
 import { LayeredXyVisFn } from '../types';
-import { logDatatables } from '../utils';
+import { logDatatables, logDatatable } from '../utils';
 import {
   validateMarkSizeRatioLimits,
   validateAddTimeMarker,
@@ -21,10 +21,14 @@ import { appendLayerIds, getDataLayers } from '../helpers';
 
 export const layeredXyVisFn: LayeredXyVisFn['fn'] = async (data, args, handlers) => {
   const layers = appendLayerIds(args.layers ?? [], 'layers');
+  const dataLayers = getDataLayers(layers);
 
-  logDatatables(layers, handlers);
+  if (args.singleTable) {
+    logDatatable(data, layers, handlers, args.splitColumnAccessor, args.splitRowAccessor);
+  } else {
+    logDatatables(layers, handlers, args.splitColumnAccessor, args.splitRowAccessor);
+  }
 
-  const dataLayers = getDataLayers(layers);
   const hasBar = hasBarLayer(dataLayers);
   validateAddTimeMarker(dataLayers, args.addTimeMarker);
   validateMarkSizeRatioLimits(args.markSizeRatio);

diff --git a/src/plugins/chart_expressions/expression_xy/common/expression_functions/validate.ts b/src/plugins/chart_expressions/expression_xy/common/expression_functions/validate.ts
@@ -171,7 +171,7 @@ export const validateExtents = (
   xAxisConfig?: XAxisConfigResult
 ) => {
   yAxisConfigs?.forEach((axis) => {
-    if (!axis.extent) {
+    if (!axis.extent || axis.extent.enforce) {
       return;
     }
     if (

diff --git a/src/plugins/chart_expressions/expression_xy/common/expression_functions/xy_vis_fn.ts b/src/plugins/chart_expressions/expression_xy/common/expression_functions/xy_vis_fn.ts
@@ -6,17 +6,12 @@
  * Side Public License, v 1.
  */
 
-import {
-  Dimension,
-  prepareLogTable,
-  validateAccessor,
-} from '@kbn/visualizations-plugin/common/utils';
+import { validateAccessor } from '@kbn/visualizations-plugin/common/utils';
 import type { Datatable } from '@kbn/expressions-plugin/common';
 import { ExpressionValueVisDimension } from '@kbn/visualizations-plugin/common/expression_functions';
-import { LayerTypes, XY_VIS_RENDERER, DATA_LAYER, REFERENCE_LINE } from '../constants';
+import { LayerTypes, XY_VIS_RENDERER, DATA_LAYER } from '../constants';
 import { appendLayerIds, getAccessors, getShowLines, normalizeTable } from '../helpers';
 import { DataLayerConfigResult, XYLayerConfig, XyVisFn, XYArgs } from '../types';
-import { getLayerDimensions } from '../utils';
 import {
   hasAreaLayer,
   hasBarLayer,
@@ -35,6 +30,7 @@ import {
   validateLinesVisibilityForChartType,
   validateAxes,
 } from './validate';
+import { logDatatable } from '../utils';
 
 const createDataLayer = (args: XYArgs, table: Datatable): DataLayerConfigResult => {
   const accessors = getAccessors<string | ExpressionValueVisDimension, XYArgs>(args, table);
@@ -108,21 +104,7 @@ export const xyVisFn: XyVisFn['fn'] = async (data, args, handlers) => {
     ...appendLayerIds(annotationLayers, 'annotationLayers'),
   ];
 
-  if (handlers.inspectorAdapters.tables) {
-    handlers.inspectorAdapters.tables.reset();
-    handlers.inspectorAdapters.tables.allowCsvExport = true;
-
-    const layerDimensions = layers.reduce<Dimension[]>((dimensions, layer) => {
-      if (layer.layerType === LayerTypes.ANNOTATIONS || layer.type === REFERENCE_LINE) {
-        return dimensions;
-      }
-
-      return [...dimensions, ...getLayerDimensions(layer)];
-    }, []);
-
-    const logTable = prepareLogTable(data, layerDimensions, true);
-    handlers.inspectorAdapters.tables.logDatatable('default', logTable);
-  }
+  logDatatable(data, layers, handlers, args.splitColumnAccessor, args.splitRowAccessor);
 
   const hasBar = hasBarLayer(dataLayers);
   const hasArea = hasAreaLayer(dataLayers);

diff --git a/src/plugins/chart_expressions/expression_xy/common/helpers/table.ts b/src/plugins/chart_expressions/expression_xy/common/helpers/table.ts
@@ -15,7 +15,10 @@ export function normalizeTable(data: Datatable, xAccessor?: string | ExpressionV
   const xColumn = xAccessor && getColumnByAccessor(xAccessor, data.columns);
   if (xColumn && xColumn?.meta.type === 'date') {
     const xColumnId = xColumn.id;
-    if (!data.rows.some((row) => typeof row[xColumnId] === 'string')) return data;
+    if (
+      !data.rows.some((row) => typeof row[xColumnId] === 'string' && row[xColumnId] !== '__other__')
+    )
+      return data;
     const rows = data.rows.map((row) => {
       return typeof row[xColumnId] !== 'string'
         ? row

diff --git a/src/plugins/chart_expressions/expression_xy/common/i18n/index.tsx b/src/plugins/chart_expressions/expression_xy/common/i18n/index.tsx
@@ -25,6 +25,18 @@ export const strings = {
     i18n.translate('expressionXY.xyVis.logDatatable.breakDown', {
       defaultMessage: 'Break down by',
     }),
+  getSplitRowHelp: () =>
+    i18n.translate('expressionXY.xyVis.logDatatable.splitRow', {
+      defaultMessage: 'Split rows by',
+    }),
+  getSplitColumnHelp: () =>
+    i18n.translate('expressionXY.xyVis.logDatatable.splitColumn', {
+      defaultMessage: 'Split columns by',
+    }),
+  getMarkSizeHelp: () =>
+    i18n.translate('expressionXY.xyVis.logDatatable.markSize', {
+      defaultMessage: 'Mark size',
+    }),
   getReferenceLineHelp: () =>
     i18n.translate('expressionXY.xyVis.logDatatable.breakDown', {
       defaultMessage: 'Break down by',

diff --git a/src/plugins/chart_expressions/expression_xy/common/types/expression_functions.ts b/src/plugins/chart_expressions/expression_xy/common/types/expression_functions.ts
@@ -71,6 +71,7 @@ export interface AxisExtentConfig {
   mode: AxisExtentMode;
   lowerBound?: number;
   upperBound?: number;
+  enforce?: boolean;
 }
 
 export interface AxisConfig {
@@ -130,6 +131,7 @@ export interface DataLayerArgs {
   isHorizontal: boolean;
   palette: PaletteOutput;
   decorations?: DataDecorationConfigResult[];
+  curveType?: XYCurveType;
 }
 
 export interface ValidLayer extends DataLayerConfigResult {
@@ -138,12 +140,12 @@ export interface ValidLayer extends DataLayerConfigResult {
 
 export interface ExtendedDataLayerArgs {
   layerId?: string;
-  accessors: string[];
+  accessors: Array<ExpressionValueVisDimension | string>;
   seriesType: SeriesType;
-  xAccessor?: string;
+  xAccessor?: string | ExpressionValueVisDimension;
   simpleView?: boolean;
-  splitAccessors?: string[];
-  markSizeAccessor?: string;
+  splitAccessors?: Array<ExpressionValueVisDimension | string>;
+  markSizeAccessor?: string | ExpressionValueVisDimension;
   lineWidth?: number;
   showPoints?: boolean;
   showLines?: boolean;
@@ -157,7 +159,7 @@ export interface ExtendedDataLayerArgs {
   palette: PaletteOutput;
   // palette will always be set on the expression
   decorations?: DataDecorationConfigResult[];
-  table?: Datatable;
+  curveType?: XYCurveType;
 }
 
 export interface LegendConfig {
@@ -215,7 +217,6 @@ export interface XYArgs extends DataLayerArgs {
   referenceLines: ReferenceLineConfigResult[];
   annotationLayers: AnnotationLayerConfigResult[];
   fittingFunction?: FittingFunction;
-  curveType?: XYCurveType;
   fillOpacity?: number;
   hideEndzones?: boolean;
   valuesInLegend?: boolean;
@@ -239,7 +240,6 @@ export interface LayeredXYArgs {
   valueLabels: ValueLabelMode;
   layers?: XYExtendedLayerConfigResult[];
   fittingFunction?: FittingFunction;
-  curveType?: XYCurveType;
   fillOpacity?: number;
   hideEndzones?: boolean;
   valuesInLegend?: boolean;
@@ -252,6 +252,9 @@ export interface LayeredXYArgs {
   minTimeBarInterval?: string;
   orderBucketsBySum?: boolean;
   showTooltip: boolean;
+  splitRowAccessor?: ExpressionValueVisDimension | string;
+  splitColumnAccessor?: ExpressionValueVisDimension | string;
+  singleTable?: boolean;
 }
 
 export interface XYProps {
@@ -261,7 +264,6 @@ export interface XYProps {
   valueLabels: ValueLabelMode;
   layers: CommonXYLayerConfig[];
   fittingFunction?: FittingFunction;
-  curveType?: XYCurveType;
   fillOpacity?: number;
   hideEndzones?: boolean;
   valuesInLegend?: boolean;
@@ -276,6 +278,7 @@ export interface XYProps {
   detailedTooltip?: boolean;
   orderBucketsBySum?: boolean;
   showTooltip: boolean;
+  singleTable?: boolean;
 }
 
 export interface AnnotationLayerArgs {
@@ -317,12 +320,14 @@ export type XYLayerConfig = DataLayerConfig | ReferenceLineConfig | AnnotationLa
 export type XYExtendedLayerConfig =
   | ExtendedDataLayerConfig
   | ReferenceLineLayerConfig
-  | ExtendedAnnotationLayerConfig;
+  | ExtendedAnnotationLayerConfig
+  | ReferenceLineConfig;
 
 export type XYExtendedLayerConfigResult =
   | ExtendedDataLayerConfigResult
   | ReferenceLineLayerConfigResult
-  | ExtendedAnnotationLayerConfigResult;
+  | ExtendedAnnotationLayerConfigResult
+  | ReferenceLineConfigResult;
 
 export interface ExtendedReferenceLineDecorationConfig extends ReferenceLineArgs {
   type: typeof EXTENDED_REFERENCE_LINE_DECORATION_CONFIG;

diff --git a/src/plugins/chart_expressions/expression_xy/common/utils/index.tsx b/src/plugins/chart_expressions/expression_xy/common/utils/index.tsx
@@ -6,4 +6,4 @@
  * Side Public License, v 1.
  */
 
-export { logDatatables, getLayerDimensions } from './log_datatables';
+export { logDatatables, logDatatable, getLayerDimensions } from './log_datatables';