Some improvements

elastic · May 13, 2022 · 097f85c · 097f85c
1 parent e2f66ca
commit 097f85c
Show file tree

Hide file tree

Showing 7 changed files with 32 additions and 18 deletions.
diff --git a/src/plugins/chart_expressions/expression_xy/public/components/legend_action.tsx b/src/plugins/chart_expressions/expression_xy/public/components/legend_action.tsx
@@ -44,7 +44,7 @@ export const getLegendAction = (
 
     const { table } = layer;
     const accessor = getAccessorByDimension(layer.splitAccessor, table.columns);
-    const formatter = formatFactory(accessor ? getFormat(table, layer.splitAccessor) : undefined);
+    const formatter = formatFactory(accessor ? getFormat(table.columns, layer.splitAccessor) : undefined);
 
     const rowIndex = table.rows.findIndex((row) => {
       if (formattedDatatables[layer.layerId]?.formattedColumns[accessor]) {

diff --git a/src/plugins/chart_expressions/expression_xy/public/components/x_domain.tsx b/src/plugins/chart_expressions/expression_xy/public/components/x_domain.tsx
@@ -6,7 +6,7 @@
  * Side Public License, v 1.
  */
 
-import { uniq } from 'lodash';
+import { isUndefined, uniq } from 'lodash';
 import React from 'react';
 import moment from 'moment';
 import { Endzones } from '@kbn/charts-plugin/public';
@@ -63,8 +63,9 @@ export const getXDomain = (
       layers
         .flatMap<number>(({ table, xAccessor }) => {
           const accessor = xAccessor && getAccessorByDimension(xAccessor, table.columns);
-          return table.rows.map((row) => row[accessor!].valueOf());
+          return table.rows.map((row) => accessor && row[accessor] && row[accessor].valueOf());
         })
+        .filter((v) => !isUndefined(v))
         .sort()
     );
 

diff --git a/src/plugins/chart_expressions/expression_xy/public/components/xy_chart.tsx b/src/plugins/chart_expressions/expression_xy/public/components/xy_chart.tsx
@@ -193,7 +193,7 @@ export function XYChart({
     : undefined;
 
   const xAxisFormatter = formatFactory(
-    dataLayers[0].xAccessor ? getFormat(dataLayers[0].table, dataLayers[0].xAccessor) : undefined
+    dataLayers[0].xAccessor ? getFormat(dataLayers[0].table.columns, dataLayers[0].xAccessor) : undefined
   );
 
   // This is a safe formatter for the xAccessor that abstracts the knowledge of already formatted layers
@@ -395,14 +395,16 @@ export function XYChart({
     const { table } = layer;
 
     const xColumn = layer.xAccessor && getColumnByAccessor(layer.xAccessor, table.columns);
-    const xAccessor = layer.xAccessor ? getAccessorByDimension(layer.xAccessor, table.columns) : '';
+    const xAccessor = layer.xAccessor
+      ? getAccessorByDimension(layer.xAccessor, table.columns)
+      : undefined;
     const currentXFormatter =
-      layer.xAccessor && formattedDatatables[layer.layerId]?.formattedColumns[xAccessor] && xColumn
-        ? formatFactory(layer.xAccessor ? getFormat(table, layer.xAccessor) : undefined)
+      xAccessor && formattedDatatables[layer.layerId]?.formattedColumns[xAccessor] && xColumn
+        ? formatFactory(layer.xAccessor ? getFormat(table.columns, layer.xAccessor) : undefined)
         : xAxisFormatter;
 
     const rowIndex = table.rows.findIndex((row) => {
-      if (layer.xAccessor) {
+      if (xAccessor) {
         if (formattedDatatables[layer.layerId]?.formattedColumns[xAccessor]) {
           // stringify the value to compare with the chart value
           return currentXFormatter.convert(row[xAccessor]) === xyGeometry.x;
@@ -423,10 +425,10 @@ export function XYChart({
       const pointValue = xySeries.seriesKeys[0];
       const splitAccessor = layer.splitAccessor
         ? getAccessorByDimension(layer.splitAccessor, table.columns)
-        : '';
+        : undefined;
 
       const splitFormatter = formatFactory(
-        layer.splitAccessor ? getFormat(table, layer.splitAccessor) : undefined
+        layer.splitAccessor ? getFormat(table.columns, layer.splitAccessor) : undefined
       );
 
       points.push({

diff --git a/src/plugins/chart_expressions/expression_xy/public/helpers/axes_configuration.ts b/src/plugins/chart_expressions/expression_xy/public/helpers/axes_configuration.ts
@@ -56,7 +56,7 @@ export function groupAxesByType(layers: CommonXYDataLayerConfig[]) {
       const yAccessor = getAccessorByDimension(accessor, table?.columns || []);
       const mode =
         yConfig?.find((yAxisConfig) => yAxisConfig.forAccessor === yAccessor)?.axisMode || 'auto';
-      let formatter: SerializedFieldFormat = getFormat(table, accessor) || {
+      let formatter: SerializedFieldFormat = getFormat(table.columns, accessor) || {
         id: 'number',
       };
       if (

diff --git a/src/plugins/chart_expressions/expression_xy/public/helpers/color_assignment.ts b/src/plugins/chart_expressions/expression_xy/public/helpers/color_assignment.ts
@@ -51,7 +51,7 @@ export function getColorAssignments(
       }
       const splitAccessor = getAccessorByDimension(layer.splitAccessor, layer.table.columns);
       const column = layer.table.columns?.find(({ id }) => id === splitAccessor);
-      const columnFormatter = column && formatFactory(getFormat(layer.table, layer.splitAccessor));
+      const columnFormatter = column && formatFactory(getFormat(layer.table.columns, layer.splitAccessor));
       const splits =
         !column || !layer.table
           ? []

diff --git a/src/plugins/chart_expressions/expression_xy/public/helpers/data_layers.tsx b/src/plugins/chart_expressions/expression_xy/public/helpers/data_layers.tsx
@@ -130,7 +130,7 @@ export const getFormattedTable = (
 
       return {
         ...formatters,
-        [id]: formatFactory(accessor ? getFormat(table, accessor) : meta.params),
+        [id]: formatFactory(accessor ? getFormat(table.columns, accessor) : meta.params),
       };
     },
     {}

diff --git a/src/plugins/chart_expressions/expression_xy/public/helpers/format.ts b/src/plugins/chart_expressions/expression_xy/public/helpers/format.ts
@@ -6,11 +6,22 @@
  * Side Public License, v 1.
  */
 
-import { Datatable } from '@kbn/expressions-plugin';
+import { DatatableColumn } from '@kbn/expressions-plugin';
 import { ExpressionValueVisDimension } from '@kbn/visualizations-plugin/common/expression_functions';
 import { getFormatByAccessor, getColumnByAccessor } from '@kbn/visualizations-plugin/common/utils';
 
-export const getFormat = (table: Datatable, accessor: string | ExpressionValueVisDimension) =>
-  getFormatByAccessor(accessor, table.columns, {
-    id: getColumnByAccessor(accessor, table.columns)?.meta.type,
-  });
+export const getFormat = (
+  columns: DatatableColumn[],
+  accessor: string | ExpressionValueVisDimension
+) => {
+  const type = getColumnByAccessor(accessor, columns)?.meta.type;
+  return getFormatByAccessor(
+    accessor,
+    columns,
+    type
+      ? {
+          id: type,
+        }
+      : undefined
+  );
+};