[Lens] Use index pattern service instead saved object client (#74654) (…

…#75631)
elastic · Aug 21, 2020 · 060f627 · 060f627
1 parent eb654d3
commit 060f627
Show file tree

Hide file tree

Showing 28 changed files with 586 additions and 417 deletions.
diff --git a/x-pack/plugins/lens/public/indexpattern_datasource/datapanel.test.tsx b/x-pack/plugins/lens/public/indexpattern_datasource/datapanel.test.tsx
@@ -87,36 +87,42 @@ const initialState: IndexPatternPrivateState = {
       fields: [
         {
           name: 'timestamp',
+          displayName: 'timestampLabel',
           type: 'date',
           aggregatable: true,
           searchable: true,
         },
         {
           name: 'bytes',
+          displayName: 'bytes',
           type: 'number',
           aggregatable: true,
           searchable: true,
         },
         {
           name: 'memory',
+          displayName: 'amemory',
           type: 'number',
           aggregatable: true,
           searchable: true,
         },
         {
           name: 'unsupported',
+          displayName: 'unsupported',
           type: 'geo',
           aggregatable: true,
           searchable: true,
         },
         {
           name: 'source',
+          displayName: 'source',
           type: 'string',
           aggregatable: true,
           searchable: true,
         },
         {
           name: 'client',
+          displayName: 'client',
           type: 'ip',
           aggregatable: true,
           searchable: true,
@@ -131,6 +137,7 @@ const initialState: IndexPatternPrivateState = {
       fields: [
         {
           name: 'timestamp',
+          displayName: 'timestampLabel',
           type: 'date',
           aggregatable: true,
           searchable: true,
@@ -145,6 +152,7 @@ const initialState: IndexPatternPrivateState = {
         },
         {
           name: 'bytes',
+          displayName: 'bytes',
           type: 'number',
           aggregatable: true,
           searchable: true,
@@ -166,6 +174,7 @@ const initialState: IndexPatternPrivateState = {
         },
         {
           name: 'source',
+          displayName: 'source',
           type: 'string',
           aggregatable: true,
           searchable: true,
@@ -185,18 +194,21 @@ const initialState: IndexPatternPrivateState = {
       fields: [
         {
           name: 'timestamp',
+          displayName: 'timestampLabel',
           type: 'date',
           aggregatable: true,
           searchable: true,
         },
         {
           name: 'bytes',
+          displayName: 'bytes',
           type: 'number',
           aggregatable: true,
           searchable: true,
         },
         {
           name: 'source',
+          displayName: 'source',
           type: 'string',
           aggregatable: true,
           searchable: true,
@@ -581,18 +593,19 @@ describe('IndexPattern Data Panel', () => {
           .find('[data-test-subj="lnsIndexPatternAvailableFields"]')
           .find(FieldItem)
           .map((fieldItem) => fieldItem.prop('field').name)
-      ).toEqual(['bytes', 'memory']);
+      ).toEqual(['memory', 'bytes']);
       wrapper
         .find('[data-test-subj="lnsIndexPatternEmptyFields"]')
         .find('button')
         .first()
         .simulate('click');
+      const emptyAccordion = wrapper.find('[data-test-subj="lnsIndexPatternEmptyFields"]');
       expect(
-        wrapper
-          .find('[data-test-subj="lnsIndexPatternEmptyFields"]')
-          .find(FieldItem)
-          .map((fieldItem) => fieldItem.prop('field').name)
+        emptyAccordion.find(FieldItem).map((fieldItem) => fieldItem.prop('field').name)
       ).toEqual(['client', 'source', 'timestamp']);
+      expect(
+        emptyAccordion.find(FieldItem).map((fieldItem) => fieldItem.prop('field').displayName)
+      ).toEqual(['client', 'source', 'timestampLabel']);
     });
 
     it('should display NoFieldsCallout when all fields are empty', async () => {
@@ -615,8 +628,8 @@ describe('IndexPattern Data Panel', () => {
         wrapper
           .find('[data-test-subj="lnsIndexPatternEmptyFields"]')
           .find(FieldItem)
-          .map((fieldItem) => fieldItem.prop('field').name)
-      ).toEqual(['bytes', 'client', 'memory', 'source', 'timestamp']);
+          .map((fieldItem) => fieldItem.prop('field').displayName)
+      ).toEqual(['amemory', 'bytes', 'client', 'source', 'timestampLabel']);
     });
 
     it('should display spinner for available fields accordion if existing fields are not loaded yet', async () => {
@@ -656,10 +669,9 @@ describe('IndexPattern Data Panel', () => {
 
       wrapper.find('[data-test-subj="typeFilter-number"]').first().simulate('click');
 
-      expect(wrapper.find(FieldItem).map((fieldItem) => fieldItem.prop('field').name)).toEqual([
-        'bytes',
-        'memory',
-      ]);
+      expect(
+        wrapper.find(FieldItem).map((fieldItem) => fieldItem.prop('field').displayName)
+      ).toEqual(['amemory', 'bytes']);
     });
 
     it('should display no fields in groups when filtered by type Record', () => {
@@ -686,14 +698,9 @@ describe('IndexPattern Data Panel', () => {
         .find('button')
         .first()
         .simulate('click');
-      expect(wrapper.find(FieldItem).map((fieldItem) => fieldItem.prop('field').name)).toEqual([
-        'Records',
-        'bytes',
-        'memory',
-        'client',
-        'source',
-        'timestamp',
-      ]);
+      expect(
+        wrapper.find(FieldItem).map((fieldItem) => fieldItem.prop('field').displayName)
+      ).toEqual(['Records', 'amemory', 'bytes', 'client', 'source', 'timestampLabel']);
     });
 
     it('should filter down by type and by name', () => {

diff --git a/x-pack/plugins/lens/public/indexpattern_datasource/datapanel.tsx b/x-pack/plugins/lens/public/indexpattern_datasource/datapanel.tsx
@@ -59,7 +59,7 @@ const FixedEuiContextMenuPanel = (EuiContextMenuPanel as unknown) as React.Funct
 >;
 
 function sortFields(fieldA: IndexPatternField, fieldB: IndexPatternField) {
-  return fieldA.name.localeCompare(fieldB.name, undefined, { sensitivity: 'base' });
+  return fieldA.displayName.localeCompare(fieldB.displayName, undefined, { sensitivity: 'base' });
 }
 
 const supportedFieldTypes = new Set(['string', 'number', 'boolean', 'date', 'ip', 'document']);
@@ -323,7 +323,8 @@ export const InnerIndexPatternDataPanel = function InnerIndexPatternDataPanel({
       fieldGroup.filter((field) => {
         if (
           localState.nameFilter.length &&
-          !field.name.toLowerCase().includes(localState.nameFilter.toLowerCase())
+          !field.name.toLowerCase().includes(localState.nameFilter.toLowerCase()) &&
+          !field.displayName.toLowerCase().includes(localState.nameFilter.toLowerCase())
         ) {
           return false;
         }

diff --git a/...lugins/lens/public/indexpattern_datasource/dimension_panel/bucket_nesting_editor.test.tsx b/...lugins/lens/public/indexpattern_datasource/dimension_panel/bucket_nesting_editor.test.tsx
@@ -8,6 +8,13 @@ import { mount } from 'enzyme';
 import React from 'react';
 import { BucketNestingEditor } from './bucket_nesting_editor';
 import { IndexPatternColumn } from '../indexpattern';
+import { IndexPatternField } from '../types';
+
+const fieldMap = {
+  a: { displayName: 'a' } as IndexPatternField,
+  b: { displayName: 'b' } as IndexPatternField,
+  c: { displayName: 'c' } as IndexPatternField,
+};
 
 describe('BucketNestingEditor', () => {
   function mockCol(col: Partial<IndexPatternColumn> = {}): IndexPatternColumn {
@@ -32,6 +39,7 @@ describe('BucketNestingEditor', () => {
   it('should display the top level grouping when at the root', () => {
     const component = mount(
       <BucketNestingEditor
+        fieldMap={fieldMap}
         columnId="a"
         layer={{
           columnOrder: ['a', 'b', 'c'],
@@ -56,6 +64,7 @@ describe('BucketNestingEditor', () => {
     const component = mount(
       <BucketNestingEditor
         columnId="a"
+        fieldMap={fieldMap}
         layer={{
           columnOrder: ['b', 'a', 'c'],
           columns: {
@@ -81,6 +90,7 @@ describe('BucketNestingEditor', () => {
     const component = mount(
       <BucketNestingEditor
         columnId="a"
+        fieldMap={fieldMap}
         layer={{
           columnOrder: ['b', 'a', 'c'],
           columns: {
@@ -124,6 +134,7 @@ describe('BucketNestingEditor', () => {
     const component = mount(
       <BucketNestingEditor
         columnId="a"
+        fieldMap={fieldMap}
         layer={{
           columnOrder: ['a', 'b', 'c'],
           columns: {
@@ -144,6 +155,7 @@ describe('BucketNestingEditor', () => {
     const component = mount(
       <BucketNestingEditor
         columnId="a"
+        fieldMap={fieldMap}
         layer={{
           columnOrder: ['a', 'b', 'c'],
           columns: {
@@ -164,6 +176,7 @@ describe('BucketNestingEditor', () => {
     const component = mount(
       <BucketNestingEditor
         columnId="a"
+        fieldMap={fieldMap}
         layer={{
           columnOrder: ['c', 'a', 'b'],
           columns: {
@@ -187,6 +200,7 @@ describe('BucketNestingEditor', () => {
     const component = mount(
       <BucketNestingEditor
         columnId="a"
+        fieldMap={fieldMap}
         layer={{
           columnOrder: ['c', 'a', 'b'],
           columns: {
@@ -213,6 +227,7 @@ describe('BucketNestingEditor', () => {
     const component = mount(
       <BucketNestingEditor
         columnId="a"
+        fieldMap={fieldMap}
         layer={{
           columnOrder: ['c', 'a', 'b'],
           columns: {
@@ -238,6 +253,7 @@ describe('BucketNestingEditor', () => {
     const setColumns = jest.fn();
     const component = mount(
       <BucketNestingEditor
+        fieldMap={fieldMap}
         columnId="b"
         layer={{
           columnOrder: ['c', 'a', 'b'],

diff --git a/x-pack/plugins/lens/public/indexpattern_datasource/dimension_panel/bucket_nesting_editor.tsx b/x-pack/plugins/lens/public/indexpattern_datasource/dimension_panel/bucket_nesting_editor.tsx
@@ -7,7 +7,7 @@
 import React from 'react';
 import { i18n } from '@kbn/i18n';
 import { EuiFormRow, EuiHorizontalRule, EuiRadio, EuiSelect, htmlIdGenerator } from '@elastic/eui';
-import { IndexPatternLayer } from '../types';
+import { IndexPatternLayer, IndexPatternField } from '../types';
 import { hasField } from '../utils';
 
 const generator = htmlIdGenerator('lens-nesting');
@@ -25,10 +25,12 @@ export function BucketNestingEditor({
   columnId,
   layer,
   setColumns,
+  fieldMap,
 }: {
   columnId: string;
   layer: IndexPatternLayer;
   setColumns: (columns: string[]) => void;
+  fieldMap: Record<string, IndexPatternField>;
 }) {
   const column = layer.columns[columnId];
   const columns = Object.entries(layer.columns);
@@ -37,14 +39,14 @@ export function BucketNestingEditor({
     .map(([value, c]) => ({
       value,
       text: c.label,
-      fieldName: hasField(c) ? c.sourceField : '',
+      fieldName: hasField(c) ? fieldMap[c.sourceField].displayName : '',
     }));
 
   if (!column || !column.isBucketed || !aggColumns.length) {
     return null;
   }
 
-  const fieldName = hasField(column) ? column.sourceField : '';
+  const fieldName = hasField(column) ? fieldMap[column.sourceField].displayName : '';
 
   const prevColumn = layer.columnOrder[layer.columnOrder.indexOf(columnId) - 1];