[Logs Explorer] Add customisation for virtual columns and add the 1st virtual column

packages/kbn-apm-synthtrace-client/src/lib/logs/index.ts

@@ -18,6 +18,8 @@ export type LogDocument = Fields &
     'data_stream.type': string;
     'data_stream.dataset': string;
     message?: string;
+    'error.message'?: string;
+    'event.original'?: string;
     'event.dataset': string;
     'log.level'?: string;
     'host.name'?: string;

packages/kbn-apm-synthtrace/src/scenarios/simple_logs.ts

@@ -37,7 +37,7 @@ const scenario: Scenario<LogDocument> = async (runOptions) => {
         .interval('1m')
         .rate(1)
         .generator((timestamp) => {
-          return Array(20)
+          return Array(3)
             .fill(0)
             .map(() => {
               const index = Math.floor(Math.random() * 3);
@@ -63,9 +63,133 @@ const scenario: Scenario<LogDocument> = async (runOptions) => {
             });
         });
 
+      const logsWithNoLogLevel = range
+        .interval('1m')
+        .rate(1)
+        .generator((timestamp) => {
+          return Array(3)
+            .fill(0)
+            .map(() => {
+              const index = Math.floor(Math.random() * 3);
+              return log
+                .create()
+                .service(SERVICE_NAMES[index])
+                .defaults({
+                  'trace.id': generateShortId(),
+                  'error.message': MESSAGE_LOG_LEVELS[index].message,
+                  'agent.name': 'synth-agent',
+                  'orchestrator.cluster.name': CLUSTER[index].clusterName,
+                  'orchestrator.cluster.id': CLUSTER[index].clusterId,
+                  'orchestrator.resource.id': generateShortId(),
+                  'cloud.provider': CLOUD_PROVIDERS[Math.floor(Math.random() * 3)],
+                  'cloud.region': CLOUD_REGION[index],
+                  'cloud.availability_zone': `${CLOUD_REGION[index]}a`,
+                  'cloud.project.id': generateShortId(),
+                  'cloud.instance.id': generateShortId(),
+                  'log.file.path': `/logs/${generateLongId()}/error.txt`,
+                })
+                .timestamp(timestamp);
+            });
+        });
+
+      const logsWithErrorMessage = range
+        .interval('1m')
+        .rate(1)
+        .generator((timestamp) => {
+          return Array(3)
+            .fill(0)
+            .map(() => {
+              const index = Math.floor(Math.random() * 3);
+              return log
+                .create()
+                .logLevel(MESSAGE_LOG_LEVELS[index].level)
+                .service(SERVICE_NAMES[index])
+                .defaults({
+                  'trace.id': generateShortId(),
+                  'error.message': MESSAGE_LOG_LEVELS[index].message,
+                  'agent.name': 'synth-agent',
+                  'orchestrator.cluster.name': CLUSTER[index].clusterName,
+                  'orchestrator.cluster.id': CLUSTER[index].clusterId,
+                  'orchestrator.resource.id': generateShortId(),
+                  'cloud.provider': CLOUD_PROVIDERS[Math.floor(Math.random() * 3)],
+                  'cloud.region': CLOUD_REGION[index],
+                  'cloud.availability_zone': `${CLOUD_REGION[index]}a`,
+                  'cloud.project.id': generateShortId(),
+                  'cloud.instance.id': generateShortId(),
+                  'log.file.path': `/logs/${generateLongId()}/error.txt`,
+                })
+                .timestamp(timestamp);
+            });
+        });
+
+      const logsWithEventMessage = range
+        .interval('1m')
+        .rate(1)
+        .generator((timestamp) => {
+          return Array(3)
+            .fill(0)
+            .map(() => {
+              const index = Math.floor(Math.random() * 3);
+              return log
+                .create()
+                .logLevel(MESSAGE_LOG_LEVELS[index].level)
+                .service(SERVICE_NAMES[index])
+                .defaults({
+                  'trace.id': generateShortId(),
+                  'event.original': MESSAGE_LOG_LEVELS[index].message,
+                  'agent.name': 'synth-agent',
+                  'orchestrator.cluster.name': CLUSTER[index].clusterName,
+                  'orchestrator.cluster.id': CLUSTER[index].clusterId,
+                  'orchestrator.resource.id': generateShortId(),
+                  'cloud.provider': CLOUD_PROVIDERS[Math.floor(Math.random() * 3)],
+                  'cloud.region': CLOUD_REGION[index],
+                  'cloud.availability_zone': `${CLOUD_REGION[index]}a`,
+                  'cloud.project.id': generateShortId(),
+                  'cloud.instance.id': generateShortId(),
+                  'log.file.path': `/logs/${generateLongId()}/error.txt`,
+                })
+                .timestamp(timestamp);
+            });
+        });
+
+      const logsWithNoMessage = range
+        .interval('1m')
+        .rate(1)
+        .generator((timestamp) => {
+          return Array(3)
+            .fill(0)
+            .map(() => {
+              const index = Math.floor(Math.random() * 3);
+              return log
+                .create()
+                .logLevel(MESSAGE_LOG_LEVELS[index].level)
+                .service(SERVICE_NAMES[index])
+                .defaults({
+                  'trace.id': generateShortId(),
+                  'agent.name': 'synth-agent',
+                  'orchestrator.cluster.name': CLUSTER[index].clusterName,
+                  'orchestrator.cluster.id': CLUSTER[index].clusterId,
+                  'orchestrator.resource.id': generateShortId(),
+                  'cloud.provider': CLOUD_PROVIDERS[Math.floor(Math.random() * 3)],
+                  'cloud.region': CLOUD_REGION[index],
+                  'cloud.availability_zone': `${CLOUD_REGION[index]}a`,
+                  'cloud.project.id': generateShortId(),
+                  'cloud.instance.id': generateShortId(),
+                  'log.file.path': `/logs/${generateLongId()}/error.txt`,
+                })
+                .timestamp(timestamp);
+            });
+        });
+
       return withClient(
         logsEsClient,
-        logger.perf('generating_logs', () => logs)
+        logger.perf('generating_logs', () => [
+          logs,
+          logsWithNoLogLevel,
+          logsWithErrorMessage,
+          logsWithEventMessage,
+          logsWithNoMessage,
+        ])
       );
     },
   };

packages/kbn-optimizer/limits.yml

@@ -85,12 +85,12 @@ pageLoadAssetSize:
   kibanaUsageCollection: 16463
   kibanaUtils: 79713
   kubernetesSecurity: 77234
-  lens: 43000
+  lens: 57135
   licenseManagement: 41817
   licensing: 29004
   links: 44490
   lists: 22900
-  logExplorer: 54342
+  logExplorer: 44977
   logsShared: 281060
   logstash: 53548
   management: 46112

packages/kbn-unified-data-table/src/components/data_table.tsx

@@ -26,7 +26,6 @@ import {
   EuiDataGridInMemory,
   EuiDataGridControlColumn,
   EuiDataGridCustomBodyProps,
-  EuiDataGridCellValueElementProps,
   EuiDataGridCustomToolbarProps,
   EuiDataGridToolBarVisibilityOptions,
   EuiDataGridToolBarVisibilityDisplaySelectorOptions,
@@ -47,10 +46,11 @@ import type { FieldFormatsStart } from '@kbn/field-formats-plugin/public';
 import type { ThemeServiceStart } from '@kbn/react-kibana-context-common';
 import type { DataPublicPluginStart } from '@kbn/data-plugin/public';
 import type { DocViewFilterFn } from '@kbn/unified-doc-viewer/types';
-import type {
+import {
   UnifiedDataTableSettings,
   ValueToStringConverter,
   DataTableColumnTypes,
+  CustomCellRenderer,
 } from '../types';
 import { getDisplayedColumns } from '../utils/columns';
 import { convertValueToString } from '../utils/convert_value_to_string';
@@ -324,10 +324,7 @@ export interface UnifiedDataTableProps {
   /**
    * An optional settings for a specified fields rendering like links. Applied only for the listed fields rendering.
    */
-  externalCustomRenderers?: Record<
-    string,
-    (props: EuiDataGridCellValueElementProps) => React.ReactNode
-  >;
+  externalCustomRenderers?: CustomCellRenderer;
   /**
    * Name of the UnifiedDataTable consumer component or application
    */

packages/kbn-unified-data-table/src/components/data_table_cell_value.tsx

@@ -0,0 +1,16 @@
+/*
+ * 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 and the Server Side Public License, v 1; you may not use this file except
+ * in compliance with, at your election, the Elastic License 2.0 or the Server
+ * Side Public License, v 1.
+ */
+
+import React from 'react';
+
+export const DataTablePopoverCellValue = ({ children }: { children: React.ReactNode }) => {
+  return <span className="unifiedDataTable__cellPopoverValue eui-textBreakWord">{children}</span>;
+};
+
+// eslint-disable-next-line import/no-default-export
+export default DataTablePopoverCellValue;

packages/kbn-unified-data-table/src/components/source_document.test.tsx

@@ -0,0 +1,57 @@
+/*
+ * 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 and the Server Side Public License, v 1; you may not use this file except
+ * in compliance with, at your election, the Elastic License 2.0 or the Server
+ * Side Public License, v 1.
+ */
+
+import { dataViewMock } from '@kbn/discover-utils/src/__mocks__';
+import { FieldFormatsStart } from '@kbn/field-formats-plugin/public';
+import { mountWithIntl } from '@kbn/test-jest-helpers';
+import React from 'react';
+import SourceDocument from './source_document';
+import type { EsHitRecord } from '@kbn/discover-utils/src/types';
+import { buildDataTableRecord } from '@kbn/discover-utils';
+
+const mockServices = {
+  fieldFormats: {
+    getDefaultInstance: jest.fn(() => ({ convert: (value: unknown) => (value ? value : '-') })),
+  },
+};
+
+const rowsSource: EsHitRecord[] = [
+  {
+    _id: '1',
+    _index: 'test',
+    _score: 1,
+    _source: { bytes: 100, extension: '.gz' },
+    highlight: {
+      extension: ['@kibana-highlighted-field.gz@/kibana-highlighted-field'],
+    },
+  },
+];
+
+const build = (hit: EsHitRecord) => buildDataTableRecord(hit, dataViewMock);
+
+describe('Unified data table source document cell rendering', function () {
+  it('renders a description list for source type documents', () => {
+    const rows = rowsSource.map(build);
+
+    const component = mountWithIntl(
+      <SourceDocument
+        useTopLevelObjectColumns={false}
+        row={rows[0]}
+        dataView={dataViewMock}
+        columnId="_source"
+        fieldFormats={mockServices.fieldFormats as unknown as FieldFormatsStart}
+        shouldShowFieldHandler={() => false}
+        maxEntries={100}
+        isPlainRecord={true}
+      />
+    );
+    expect(component.html()).toMatchInlineSnapshot(
+      `"<dl class=\\"euiDescriptionList unifiedDataTable__descriptionList unifiedDataTable__cellValue css-id58dh-euiDescriptionList-inline-left\\" data-test-subj=\\"discoverCellDescriptionList\\" data-type=\\"inline\\"><dt class=\\"euiDescriptionList__title unifiedDataTable__descriptionListTitle css-1fizlic-euiDescriptionList__title-inline-compressed\\">_index</dt><dd class=\\"euiDescriptionList__description unifiedDataTable__descriptionListDescription css-11rdew2-euiDescriptionList__description-inline-compressed\\">test</dd><dt class=\\"euiDescriptionList__title unifiedDataTable__descriptionListTitle css-1fizlic-euiDescriptionList__title-inline-compressed\\">_score</dt><dd class=\\"euiDescriptionList__description unifiedDataTable__descriptionListDescription css-11rdew2-euiDescriptionList__description-inline-compressed\\">1</dd></dl>"`
+    );
+  });
+});