[lens] show 'View details' UI action to open clusters inspector tab when request fails

packages/kbn-search-errors/index.ts

@@ -6,7 +6,7 @@
  * Side Public License, v 1.
  */
 
+export { createEsError } from './src/create_es_error';
 export { isEsError, EsError } from './src/es_error';
-export { isPainlessError, PainlessError } from './src/painless_error';
 export { renderSearchError } from './src/render_search_error';
 export type { IEsError } from './src/types';

packages/kbn-search-errors/src/create_es_error.ts

@@ -0,0 +1,64 @@
+/*
+ * 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 { estypes } from '@elastic/elasticsearch';
+import { i18n } from '@kbn/i18n';
+import type { ApplicationStart, CoreStart } from '@kbn/core/public';
+import type { DataView } from '@kbn/data-views-plugin/common';
+import { IEsError } from './types';
+import { EsError } from './es_error';
+import { PainlessError } from './painless_error';
+import { TsdbError } from './tsdb_error';
+
+export interface Services {
+  application: ApplicationStart;
+  docLinks: CoreStart['docLinks'];
+}
+
+function getNestedCauses(errorCause: estypes.ErrorCause): estypes.ErrorCause[] {
+  // Give shard failures priority, then try to get the error navigating nested objects
+  if (errorCause.failed_shards) {
+    return (errorCause.failed_shards as estypes.ShardFailure[]).map(
+      (shardFailure) => shardFailure.reason
+    );
+  }
+  return errorCause.caused_by ? getNestedCauses(errorCause.caused_by) : [errorCause];
+}
+
+export function createEsError(
+  err: IEsError,
+  openInInspector: () => void,
+  services: Services,
+  dataView?: DataView
+) {
+  const rootCauses = err.attributes?.error ? getNestedCauses(err.attributes?.error) : [];
+
+  const painlessCause = rootCauses.find((errorCause) => {
+    return errorCause.lang && errorCause.lang === 'painless';
+  });
+  if (painlessCause) {
+    return new PainlessError(err, openInInspector, painlessCause, services.application, dataView);
+  }
+
+  const tsdbCause = rootCauses.find((errorCause) => {
+    return (
+      errorCause.type === 'illegal_argument_exception' &&
+      errorCause.reason &&
+      /\]\[counter\] is not supported for aggregation/.test(errorCause.reason)
+    );
+  });
+  if (tsdbCause) {
+    return new TsdbError(err, openInInspector, tsdbCause, services.docLinks);
+  }
+
+  const causeReason = rootCauses[0]?.reason ?? err.attributes?.error?.reason;
+  const message = causeReason
+    ? causeReason
+    : i18n.translate('searchErrors.esError.unknownRootCause', { defaultMessage: 'unknown' });
+  return new EsError(err, message, openInInspector);
+}

packages/kbn-search-errors/src/es_error.test.tsx

@@ -6,41 +6,31 @@
  * Side Public License, v 1.
  */
 
-import { EsError } from './es_error';
-import { IEsError } from './types';
+import type { ReactElement } from 'react';
+import type { CoreStart } from '@kbn/core/public';
+import { createEsError } from './create_es_error';
+import { renderSearchError } from './render_search_error';
+import { shallow } from 'enzyme';
+import { coreMock } from '@kbn/core/public/mocks';
 
-describe('EsError', () => {
-  it('contains the same body as the wrapped error', () => {
-    const error = {
-      statusCode: 500,
-      message: 'nope',
-      attributes: {
-        error: {
-          type: 'top_level_exception_type',
-          reason: 'top-level reason',
-        },
+const services = {
+  application: coreMock.createStart().application,
+  docLinks: {
+    links: {
+      fleet: {
+        datastreamsTSDSMetrics: '',
       },
-    } as IEsError;
-    const esError = new EsError(error, () => {});
-
-    expect(typeof esError.attributes).toEqual('object');
-    expect(esError.attributes).toEqual(error.attributes);
-  });
+    },
+  } as CoreStart['docLinks'],
+};
 
-  it('contains some explanation of the error in the message', () => {
-    // error taken from Vega's issue
-    const error = {
-      message:
-        'x_content_parse_exception: [x_content_parse_exception] Reason: [1:78] [date_histogram] failed to parse field [calendar_interval]',
+describe('EsError', () => {
+  const esError = createEsError(
+    {
       statusCode: 400,
+      message: 'search_phase_execution_exception',
       attributes: {
         error: {
-          root_cause: [
-            {
-              type: 'x_content_parse_exception',
-              reason: '[1:78] [date_histogram] failed to parse field [calendar_interval]',
-            },
-          ],
           type: 'x_content_parse_exception',
           reason: '[1:78] [date_histogram] failed to parse field [calendar_interval]',
           caused_by: {
@@ -49,10 +39,27 @@ describe('EsError', () => {
           },
         },
       },
-    } as IEsError;
-    const esError = new EsError(error, () => {});
+    },
+    () => {},
+    services
+  );
+
+  test('should set error.message to root "error cause" reason', () => {
     expect(esError.message).toEqual(
-      'EsError: The supplied interval [2q] could not be parsed as a calendar interval.'
+      'The supplied interval [2q] could not be parsed as a calendar interval.'
     );
   });
+
+  test('should render error message', () => {
+    const searchErrorDisplay = renderSearchError(esError);
+    expect(searchErrorDisplay).not.toBeUndefined();
+    const wrapper = shallow(searchErrorDisplay?.body as ReactElement);
+    expect(wrapper).toMatchSnapshot();
+  });
+
+  test('should return 1 action', () => {
+    const searchErrorDisplay = renderSearchError(esError);
+    expect(searchErrorDisplay).not.toBeUndefined();
+    expect(searchErrorDisplay?.actions?.length).toBe(1);
+  });
 });

packages/kbn-search-errors/src/es_error.tsx

@@ -7,11 +7,9 @@
  */
 
 import React from 'react';
-import { EuiButton, EuiCodeBlock, EuiSpacer } from '@elastic/eui';
 import { i18n } from '@kbn/i18n';
-import type { ApplicationStart } from '@kbn/core/public';
-import { IEsError } from './types';
-import { getRootCause } from './utils';
+import { EuiButton, EuiCodeBlock } from '@elastic/eui';
+import type { IEsError } from './types';
 
 /**
  * Checks if a given errors originated from Elasticsearch.
@@ -24,39 +22,25 @@ export function isEsError(e: any): e is IEsError {
 }
 
 export class EsError extends Error {
-  readonly attributes: IEsError['attributes'];
+  public readonly attributes: IEsError['attributes'];
+  private readonly openInInspector: () => void;
 
-  constructor(protected readonly err: IEsError, private readonly openInInspector: () => void) {
-    super(
-      `EsError: ${
-        getRootCause(err?.attributes?.error)?.reason ||
-        i18n.translate('searchErrors.esError.unknownRootCause', { defaultMessage: 'unknown' })
-      }`
-    );
+  constructor(err: IEsError, message: string, openInInspector: () => void) {
+    super(message);
     this.attributes = err.attributes;
+    this.openInInspector = openInInspector;
     Object.setPrototypeOf(this, new.target.prototype);
   }
 
   public getErrorMessage() {
-    if (!this.attributes?.error) {
-      return null;
-    }
-
-    const rootCause = getRootCause(this.attributes.error)?.reason;
-    const topLevelCause = this.attributes.error.reason;
-    const cause = rootCause ?? topLevelCause;
-
     return (
-      <>
-        <EuiSpacer size="s" />
-        <EuiCodeBlock data-test-subj="errMessage" isCopyable={true} paddingSize="s">
-          {cause}
-        </EuiCodeBlock>
-      </>
+      <EuiCodeBlock data-test-subj="errMessage" isCopyable={true} paddingSize="s">
+        {this.message}
+      </EuiCodeBlock>
     );
   }
 
-  public getActions(application: ApplicationStart) {
+  public getActions() {
     return [
       <EuiButton
         data-test-subj="viewEsErrorButton"