[Lens] Move Lens functions to common (#105455) (#106719)

* 🚚 First move batch to common * 🚚 Second batch of move * 🏷️ Import types only * 🚚 Third batch * 🚚 Fourth batch move * 🚚 Another module moved * 🚚 More function moved * 🚚 Last bit of move * ⚡ Reduce page load bundle size * 🐛 Fix import issue * 🐛 More import fix * ✨ Registered functions on the server * 🐛 Expose datatable_column as well * ✅ Add server side expression test * 🚚 Moved back render functions to public * ✨ Add a timezone arg to time_scale * 🔥 Remove timezone arg * 🔥 Remove server side code for now * 👌 Integrated feedback * 🚚 Move back datatable render function * 🏷️ Fix imports * 🏷️ Fix missing export * 🚚 Move render functions back! Co-authored-by: Kibana Machine <[email protected]> Co-authored-by: Marco Liberati <[email protected]>
elastic · Jul 26, 2021 · 1b92b79 · 1b92b79
1 parent bdceec1
commit 1b92b79
Show file tree

Hide file tree

Showing 136 changed files with 2,123 additions and 1,792 deletions.
diff --git a/...asource/counter_rate/counter_rate.test.ts → ...essions/counter_rate/counter_rate.test.ts b/...asource/counter_rate/counter_rate.test.ts → ...essions/counter_rate/counter_rate.test.ts
@@ -5,7 +5,7 @@
  * 2.0.
  */
 
-import { counterRate, CounterRateArgs } from '../counter_rate';
+import { counterRate, CounterRateArgs } from './index';
 
 import { Datatable } from 'src/plugins/expressions/public';
 import { functionWrapper } from 'src/plugins/expressions/common/expression_functions/specs/tests/utils';

diff --git a/...xpattern_datasource/counter_rate/index.ts → .../common/expressions/counter_rate/index.ts b/...xpattern_datasource/counter_rate/index.ts → .../common/expressions/counter_rate/index.ts
@@ -6,11 +6,14 @@
  */
 
 import { i18n } from '@kbn/i18n';
-import { ExpressionFunctionDefinition, Datatable } from 'src/plugins/expressions/public';
 import {
   getBucketIdentifier,
   buildResultColumns,
 } from '../../../../../../src/plugins/expressions/common';
+import type {
+  ExpressionFunctionDefinition,
+  Datatable,
+} from '../../../../../../src/plugins/expressions/common';
 
 export interface CounterRateArgs {
   by?: string[];

diff --git a/x-pack/plugins/lens/common/expressions/datatable/datatable.ts b/x-pack/plugins/lens/common/expressions/datatable/datatable.ts
@@ -0,0 +1,158 @@
+/*
+ * 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; you may not use this file except in compliance with the Elastic License
+ * 2.0.
+ */
+
+import { i18n } from '@kbn/i18n';
+import { cloneDeep } from 'lodash';
+import type {
+  DatatableColumnMeta,
+  ExpressionFunctionDefinition,
+} from '../../../../../../src/plugins/expressions/common';
+import type { FormatFactory, LensMultiTable } from '../../types';
+import type { ColumnConfigArg } from './datatable_column';
+import { getSortingCriteria } from './sorting';
+import { computeSummaryRowForColumn } from './summary';
+import { transposeTable } from './transpose_helpers';
+
+export interface SortingState {
+  columnId: string | undefined;
+  direction: 'asc' | 'desc' | 'none';
+}
+
+export interface DatatableProps {
+  data: LensMultiTable;
+  untransposedData?: LensMultiTable;
+  args: DatatableArgs;
+}
+
+export interface DatatableRender {
+  type: 'render';
+  as: 'lens_datatable_renderer';
+  value: DatatableProps;
+}
+
+export interface DatatableArgs {
+  title: string;
+  description?: string;
+  columns: ColumnConfigArg[];
+  sortingColumnId: SortingState['columnId'];
+  sortingDirection: SortingState['direction'];
+}
+
+function isRange(meta: { params?: { id?: string } } | undefined) {
+  return meta?.params?.id === 'range';
+}
+
+export const getDatatable = ({
+  formatFactory,
+}: {
+  formatFactory: FormatFactory;
+}): ExpressionFunctionDefinition<
+  'lens_datatable',
+  LensMultiTable,
+  DatatableArgs,
+  DatatableRender
+> => ({
+  name: 'lens_datatable',
+  type: 'render',
+  inputTypes: ['lens_multitable'],
+  help: i18n.translate('xpack.lens.datatable.expressionHelpLabel', {
+    defaultMessage: 'Datatable renderer',
+  }),
+  args: {
+    title: {
+      types: ['string'],
+      help: i18n.translate('xpack.lens.datatable.titleLabel', {
+        defaultMessage: 'Title',
+      }),
+    },
+    description: {
+      types: ['string'],
+      help: '',
+    },
+    columns: {
+      types: ['lens_datatable_column'],
+      help: '',
+      multi: true,
+    },
+    sortingColumnId: {
+      types: ['string'],
+      help: '',
+    },
+    sortingDirection: {
+      types: ['string'],
+      help: '',
+    },
+  },
+  fn(data, args, context) {
+    let untransposedData: LensMultiTable | undefined;
+    // do the sorting at this level to propagate it also at CSV download
+    const [firstTable] = Object.values(data.tables);
+    const [layerId] = Object.keys(context.inspectorAdapters.tables || {});
+    const formatters: Record<string, ReturnType<FormatFactory>> = {};
+
+    firstTable.columns.forEach((column) => {
+      formatters[column.id] = formatFactory(column.meta?.params);
+    });
+
+    const hasTransposedColumns = args.columns.some((c) => c.isTransposed);
+    if (hasTransposedColumns) {
+      // store original shape of data separately
+      untransposedData = cloneDeep(data);
+      // transposes table and args inplace
+      transposeTable(args, firstTable, formatters);
+    }
+
+    const { sortingColumnId: sortBy, sortingDirection: sortDirection } = args;
+
+    const columnsReverseLookup = firstTable.columns.reduce<
+      Record<string, { name: string; index: number; meta?: DatatableColumnMeta }>
+    >((memo, { id, name, meta }, i) => {
+      memo[id] = { name, index: i, meta };
+      return memo;
+    }, {});
+
+    const columnsWithSummary = args.columns.filter((c) => c.summaryRow);
+    for (const column of columnsWithSummary) {
+      column.summaryRowValue = computeSummaryRowForColumn(
+        column,
+        firstTable,
+        formatters,
+        formatFactory({ id: 'number' })
+      );
+    }
+
+    if (sortBy && columnsReverseLookup[sortBy] && sortDirection !== 'none') {
+      // Sort on raw values for these types, while use the formatted value for the rest
+      const sortingCriteria = getSortingCriteria(
+        isRange(columnsReverseLookup[sortBy]?.meta)
+          ? 'range'
+          : columnsReverseLookup[sortBy]?.meta?.type,
+        sortBy,
+        formatters[sortBy],
+        sortDirection
+      );
+      // replace the table here
+      context.inspectorAdapters.tables[layerId].rows = (firstTable.rows || [])
+        .slice()
+        .sort(sortingCriteria);
+      // replace also the local copy
+      firstTable.rows = context.inspectorAdapters.tables[layerId].rows;
+    } else {
+      args.sortingColumnId = undefined;
+      args.sortingDirection = 'none';
+    }
+    return {
+      type: 'render',
+      as: 'lens_datatable_renderer',
+      value: {
+        data,
+        untransposedData,
+        args,
+      },
+    };
+  },
+});
diff --git a/x-pack/plugins/lens/common/expressions/datatable/datatable_column.ts b/x-pack/plugins/lens/common/expressions/datatable/datatable_column.ts
@@ -0,0 +1,85 @@
+/*
+ * 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; you may not use this file except in compliance with the Elastic License
+ * 2.0.
+ */
+
+import type { Direction } from '@elastic/eui';
+import type {
+  CustomPaletteState,
+  PaletteOutput,
+} from '../../../../../../src/plugins/charts/common';
+import type {
+  ExpressionFunctionDefinition,
+  DatatableColumn,
+} from '../../../../../../src/plugins/expressions/common';
+import type { CustomPaletteParams } from '../../types';
+
+export type LensGridDirection = 'none' | Direction;
+
+export interface ColumnConfig {
+  columns: ColumnConfigArg[];
+  sortingColumnId: string | undefined;
+  sortingDirection: LensGridDirection;
+}
+
+export type ColumnConfigArg = Omit<ColumnState, 'palette'> & {
+  type: 'lens_datatable_column';
+  palette?: PaletteOutput<CustomPaletteState>;
+  summaryRowValue?: unknown;
+};
+
+export interface ColumnState {
+  columnId: string;
+  width?: number;
+  hidden?: boolean;
+  isTransposed?: boolean;
+  // These flags are necessary to transpose columns and map them back later
+  // They are set automatically and are not user-editable
+  transposable?: boolean;
+  originalColumnId?: string;
+  originalName?: string;
+  bucketValues?: Array<{ originalBucketColumn: DatatableColumn; value: unknown }>;
+  alignment?: 'left' | 'right' | 'center';
+  palette?: PaletteOutput<CustomPaletteParams>;
+  colorMode?: 'none' | 'cell' | 'text';
+  summaryRow?: 'none' | 'sum' | 'avg' | 'count' | 'min' | 'max';
+  summaryLabel?: string;
+}
+
+export type DatatableColumnResult = ColumnState & { type: 'lens_datatable_column' };
+
+export const datatableColumn: ExpressionFunctionDefinition<
+  'lens_datatable_column',
+  null,
+  ColumnState,
+  DatatableColumnResult
+> = {
+  name: 'lens_datatable_column',
+  aliases: [],
+  type: 'lens_datatable_column',
+  help: '',
+  inputTypes: ['null'],
+  args: {
+    columnId: { types: ['string'], help: '' },
+    alignment: { types: ['string'], help: '' },
+    hidden: { types: ['boolean'], help: '' },
+    width: { types: ['number'], help: '' },
+    isTransposed: { types: ['boolean'], help: '' },
+    transposable: { types: ['boolean'], help: '' },
+    colorMode: { types: ['string'], help: '' },
+    palette: {
+      types: ['palette'],
+      help: '',
+    },
+    summaryRow: { types: ['string'], help: '' },
+    summaryLabel: { types: ['string'], help: '' },
+  },
+  fn: function fn(input: unknown, args: ColumnState) {
+    return {
+      type: 'lens_datatable_column',
+      ...args,
+    };
+  },
+};
diff --git a/x-pack/plugins/lens/common/expressions/datatable/index.ts b/x-pack/plugins/lens/common/expressions/datatable/index.ts
@@ -0,0 +1,12 @@
+/*
+ * 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; you may not use this file except in compliance with the Elastic License
+ * 2.0.
+ */
+
+export * from './datatable_column';
+export * from './datatable';
+export * from './summary';
+export * from './transpose_helpers';
+export * from './utils';
diff --git a/.../datatable_visualization/sorting.test.tsx → ...on/expressions/datatable/sorting.test.tsx b/.../datatable_visualization/sorting.test.tsx → ...on/expressions/datatable/sorting.test.tsx
diff --git a/...ublic/datatable_visualization/sorting.tsx → .../common/expressions/datatable/sorting.tsx b/...ublic/datatable_visualization/sorting.tsx → .../common/expressions/datatable/sorting.tsx
@@ -7,7 +7,7 @@
 
 import ipaddr from 'ipaddr.js';
 import type { IPv4, IPv6 } from 'ipaddr.js';
-import { FieldFormat } from 'src/plugins/data/public';
+import type { FieldFormat } from '../../../../../../src/plugins/data/common';
 
 function isIPv6Address(ip: IPv4 | IPv6): ip is IPv6 {
   return ip.kind() === 'ipv6';

diff --git a/...c/datatable_visualization/summary.test.ts → ...mon/expressions/datatable/summary.test.ts b/...c/datatable_visualization/summary.test.ts → ...mon/expressions/datatable/summary.test.ts
@@ -5,7 +5,7 @@
  * 2.0.
  */
 
-import { IFieldFormat } from 'src/plugins/data/public';
+import { IFieldFormat } from 'src/plugins/data/common';
 import { Datatable } from 'src/plugins/expressions';
 import { computeSummaryRowForColumn, getFinalSummaryConfiguration } from './summary';
 

diff --git a/...public/datatable_visualization/summary.ts → ...s/common/expressions/datatable/summary.ts b/...public/datatable_visualization/summary.ts → ...s/common/expressions/datatable/summary.ts
@@ -6,11 +6,11 @@
  */
 
 import { i18n } from '@kbn/i18n';
-import { FieldFormat } from 'src/plugins/data/public';
-import { Datatable } from 'src/plugins/expressions/public';
-import { ColumnConfigArg } from './datatable_visualization';
+import type { FieldFormat } from '../../../../../../src/plugins/data/common';
+import type { Datatable } from '../../../../../../src/plugins/expressions/common';
+import { ColumnConfigArg } from './datatable_column';
 import { getOriginalId } from './transpose_helpers';
-import { isNumericField } from './utils';
+import { isNumericFieldForDatatable } from './utils';
 
 type SummaryRowType = Extract<ColumnConfigArg['summaryRow'], string>;
 
@@ -19,7 +19,7 @@ export function getFinalSummaryConfiguration(
   columnArgs: Pick<ColumnConfigArg, 'summaryRow' | 'summaryLabel'> | undefined,
   table: Datatable | undefined
 ) {
-  const isNumeric = isNumericField(table, columnId);
+  const isNumeric = isNumericFieldForDatatable(table, columnId);
 
   const summaryRow = isNumeric ? columnArgs?.summaryRow || 'none' : 'none';
   const summaryLabel = columnArgs?.summaryLabel ?? getDefaultSummaryLabel(summaryRow);

diff --git a/...e_visualization/transpose_helpers.test.ts → ...sions/datatable/transpose_helpers.test.ts b/...e_visualization/transpose_helpers.test.ts → ...sions/datatable/transpose_helpers.test.ts
@@ -7,8 +7,8 @@
 
 import type { FieldFormat } from 'src/plugins/data/public';
 import type { Datatable } from 'src/plugins/expressions';
+import { DatatableArgs } from './datatable';
 
-import { Args } from './expression';
 import { transposeTable } from './transpose_helpers';
 
 describe('transpose_helpes', () => {
@@ -59,7 +59,7 @@ describe('transpose_helpes', () => {
     };
   }
 
-  function buildArgs(): Args {
+  function buildArgs(): DatatableArgs {
     return {
       title: 'Table',
       sortingColumnId: undefined,

diff --git a/...atable_visualization/transpose_helpers.ts → ...xpressions/datatable/transpose_helpers.ts b/...atable_visualization/transpose_helpers.ts → ...xpressions/datatable/transpose_helpers.ts
@@ -5,11 +5,14 @@
  * 2.0.
  */
 
-import type { FieldFormat } from 'src/plugins/data/public';
-import type { Datatable, DatatableColumn, DatatableRow } from 'src/plugins/expressions';
-import { ColumnConfig } from './components/table_basic';
-
-import { Args, ColumnConfigArg } from './expression';
+import type {
+  Datatable,
+  DatatableColumn,
+  DatatableRow,
+} from '../../../../../../src/plugins/expressions';
+import type { FieldFormat } from '../../../../../../src/plugins/data/common';
+import type { DatatableArgs } from './datatable';
+import type { ColumnConfig, ColumnConfigArg } from './datatable_column';
 
 const TRANSPOSE_SEPARATOR = '---';
 
@@ -42,7 +45,7 @@ export function getOriginalId(id: string) {
  * @param formatters Formatters for all columns to transpose columns by actual display values
  */
 export function transposeTable(
-  args: Args,
+  args: DatatableArgs,
   firstTable: Datatable,
   formatters: Record<string, FieldFormat>
 ) {
@@ -112,7 +115,7 @@ function transposeRows(
  * grouped by unique value
  */
 function updateColumnArgs(
-  args: Args,
+  args: DatatableArgs,
   bucketsColumnArgs: ColumnConfig['columns'],
   transposedColumnGroups: Array<ColumnConfig['columns']>
 ) {
@@ -150,7 +153,7 @@ function getUniqueValues(table: Datatable, formatter: FieldFormat, columnId: str
  * @param uniqueValues
  */
 function transposeColumns(
-  args: Args,
+  args: DatatableArgs,
   bucketsColumnArgs: ColumnConfig['columns'],
   metricColumns: ColumnConfig['columns'],
   firstTable: Datatable,