Fix wrong runtime field format on alert table (#120744) (#121080)

* Fix wrong runtime field format on alert table

* Fix CI

Co-authored-by: Kibana Machine <42973632+kibanamachine@users.noreply.github.com>

Co-authored-by: Pablo Machado <pablo.nevesmachado@elastic.co>
This commit is contained in:
Kibana Machine 2021-12-13 10:18:07 -05:00 committed by GitHub
parent 7cb03edc1e
commit a755b42c2b
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
4 changed files with 107 additions and 10 deletions

View file

@ -633,7 +633,7 @@ export interface ColumnHeaderResult {
category?: Maybe<string>;
columnHeaderType?: Maybe<string>;
description?: Maybe<string>;
example?: Maybe<string>;
example?: Maybe<string | number>;
indexes?: Maybe<string[]>;
id?: Maybe<string>;
name?: Maybe<string>;

View file

@ -76,8 +76,8 @@ export type ColumnHeaderOptions = Pick<
tGridCellActions?: TGridCellAction[];
category?: string;
columnHeaderType: ColumnHeaderType;
description?: string;
example?: string;
description?: string | null;
example?: string | number | null;
format?: string;
linkField?: string;
placeholder?: string;

View file

@ -319,6 +319,108 @@ describe('helpers', () => {
getColumnHeaders([headerDoesNotMatchBrowserField], mockBrowserFields).map(omit('display'))
).toEqual(expected);
});
describe('augment the `header` with metadata from `browserFields`', () => {
test('it should augment the `header` when field category is base', () => {
const fieldName = 'test_field';
const testField = {
aggregatable: true,
category: 'base',
description:
'Date/time when the event originated. For log events this is the date/time when the event was generated, and not when it was read. Required field for all events.',
example: '2016-05-23T08:05:34.853Z',
format: 'date',
indexes: ['auditbeat', 'filebeat', 'packetbeat'],
name: fieldName,
searchable: true,
type: 'date',
};
const browserField = { base: { fields: { [fieldName]: testField } } };
const header: ColumnHeaderOptions = {
columnHeaderType: 'not-filtered',
id: fieldName,
};
expect(
getColumnHeaders([header], browserField).map(
omit(['display', 'actions', 'isSortable', 'defaultSortDirection', 'schema'])
)
).toEqual([
{
...header,
...browserField.base.fields[fieldName],
},
]);
});
test("it should augment the `header` when field is top level and name isn't splittable", () => {
const fieldName = 'testFieldName';
const testField = {
aggregatable: true,
category: fieldName,
description: 'test field description',
example: '2016-05-23T08:05:34.853Z',
format: 'date',
indexes: ['auditbeat', 'filebeat', 'packetbeat'],
name: fieldName,
searchable: true,
type: 'date',
};
const browserField = { [fieldName]: { fields: { [fieldName]: testField } } };
const header: ColumnHeaderOptions = {
columnHeaderType: 'not-filtered',
id: fieldName,
};
expect(
getColumnHeaders([header], browserField).map(
omit(['display', 'actions', 'isSortable', 'defaultSortDirection', 'schema'])
)
).toEqual([
{
...header,
...browserField[fieldName].fields[fieldName],
},
]);
});
test('it should augment the `header` when field is splittable', () => {
const fieldName = 'test.field.splittable';
const testField = {
aggregatable: true,
category: 'test',
description: 'test field description',
example: '2016-05-23T08:05:34.853Z',
format: 'date',
indexes: ['auditbeat', 'filebeat', 'packetbeat'],
name: fieldName,
searchable: true,
type: 'date',
};
const browserField = { test: { fields: { [fieldName]: testField } } };
const header: ColumnHeaderOptions = {
columnHeaderType: 'not-filtered',
id: fieldName,
};
expect(
getColumnHeaders([header], browserField).map(
omit(['display', 'actions', 'isSortable', 'defaultSortDirection', 'schema'])
)
).toEqual([
{
...header,
...browserField.test.fields[fieldName],
},
]);
});
});
});
describe('getActionsColumnWidth', () => {

View file

@ -7,7 +7,7 @@
import { euiThemeVars } from '@kbn/ui-shared-deps-src/theme';
import { EuiDataGridColumnActions } from '@elastic/eui';
import { get, keyBy } from 'lodash/fp';
import { keyBy } from 'lodash/fp';
import React from 'react';
import type {
@ -91,17 +91,12 @@ export const getColumnHeaders = (
const browserFieldByName = getAllFieldsByName(browserFields);
return headers
? headers.map((header) => {
const splitHeader = header.id.split('.'); // source.geo.city_name -> [source, geo, city_name]
const browserField: Partial<BrowserField> | undefined = browserFieldByName[header.id];
// augment the header with metadata from browserFields:
const augmentedHeader = {
...header,
...get(
[splitHeader.length > 1 ? splitHeader[0] : 'base', 'fields', header.id],
browserFields
),
...browserField,
schema: header.schema ?? getSchema(browserField?.type),
};