[Discover][Traces] All "Open in Discover" links now open in a new Discover Tab on left-click

src/platform/packages/shared/kbn-unified-doc-viewer/src/services/types.ts

@@ -8,7 +8,7 @@
  */
 
 import type { DataView } from '@kbn/data-views-plugin/public';
-import type { AggregateQuery, Query } from '@kbn/es-query';
+import type { AggregateQuery, Query, TimeRange } from '@kbn/es-query';
 import type { DataTableRecord, DataTableColumnsMeta } from '@kbn/discover-utils/types';
 import type { RestorableStateProviderProps } from '@kbn/restorable-state';
 import type { ReactElement } from 'react';
@@ -43,6 +43,15 @@ export type DocViewFilterFn = (
   mode: '+' | '-'
 ) => void;
 
+export interface DocViewActions {
+  openInNewTab?: (params: {
+    query?: Query | AggregateQuery;
+    tabLabel?: string;
+    timeRange?: TimeRange;
+  }) => void;
+  updateESQLQuery?: (queryOrUpdater: string | ((prevQuery: string) => string)) => void;
+}
+
 export interface DocViewRenderProps {
   hit: DataTableRecord;
   dataView: DataView;

src/platform/packages/shared/kbn-unified-doc-viewer/src/types.ts

@@ -9,6 +9,7 @@
 
 export type {
   DocView,
+  DocViewActions,
   DocViewFilterFn,
   DocViewRenderProps,
   DocViewerComponent,

src/platform/packages/shared/kbn-unified-doc-viewer/types.ts

@@ -8,4 +8,10 @@
  */
 
 export type { ElasticRequestState } from '.';
-export type { DocViewFilterFn, DocViewRenderProps, DocView, DocViewerComponent } from './src/types';
+export type {
+  DocViewFilterFn,
+  DocViewRenderProps,
+  DocView,
+  DocViewerComponent,
+  DocViewActions,
+} from './src/types';

src/platform/plugins/shared/discover/public/context_awareness/profile_providers/observability/log_document_profile/accessors/get_doc_viewer.tsx

@@ -18,7 +18,7 @@ import {
   UnifiedDocViewerLogsOverview,
   type UnifiedDocViewerLogsOverviewApi,
 } from '@kbn/unified-doc-viewer-plugin/public';
-import type { DocViewRenderProps } from '@kbn/unified-doc-viewer/types';
+import type { DocViewRenderProps, DocViewActions } from '@kbn/unified-doc-viewer/types';
 import React, { useEffect, useRef, useState } from 'react';
 import type { BehaviorSubject } from 'rxjs';
 import { filter, skip } from 'rxjs';
@@ -67,6 +67,7 @@ export const createGetDocViewer =
                 logsAIInsightFeature={logsAIInsightFeature}
                 streamsFeature={streamsFeature}
                 indexes={indexes}
+                docViewActions={params.actions}
                 {...props}
               />
             );
@@ -84,6 +85,7 @@ interface LogOverviewTabProps extends DocViewRenderProps {
   logsAIInsightFeature: ObservabilityLogsAIInsightFeature | undefined;
   streamsFeature: ObservabilityStreamsFeature | undefined;
   indexes: ObservabilityIndexes;
+  docViewActions?: DocViewActions;
 }
 
 const LogOverviewTab = ({
@@ -92,6 +94,7 @@ const LogOverviewTab = ({
   logsAIInsightFeature,
   streamsFeature,
   indexes,
+  docViewActions,
   ...props
 }: LogOverviewTabProps) => {
   const [logsOverviewApi, setLogsOverviewApi] = useState<UnifiedDocViewerLogsOverviewApi | null>(
@@ -102,6 +105,7 @@ const LogOverviewTab = ({
   return (
     <UnifiedDocViewerLogsOverview
       {...props}
+      docViewActions={docViewActions}
       ref={setLogsOverviewApi}
       renderAIAssistant={logsAIAssistantFeature?.render}
       renderAIInsight={logsAIInsightFeature?.render}

src/platform/plugins/shared/discover/public/context_awareness/profile_providers/observability/observability_document_profile/document_profile/accessors/doc_viewer.tsx

@@ -31,7 +31,11 @@ export const createGetDocViewer =
           title: tabTitle,
           order: 0,
           render: (props) => (
-            <UnifiedDocViewerObservabilityGenericOverview {...props} indexes={indexes} />
+            <UnifiedDocViewerObservabilityGenericOverview
+              {...props}
+              indexes={indexes}
+              docViewActions={params.actions}
+            />
           ),
         });
 

src/platform/plugins/shared/discover/public/context_awareness/profile_providers/observability/traces_document_profile/document_profile/accessors/doc_viewer.tsx

@@ -31,7 +31,11 @@ export const createGetDocViewer =
           title: tabTitle,
           order: 0,
           render: (props) => (
-            <UnifiedDocViewerObservabilityTracesOverview {...props} indexes={indexes} />
+            <UnifiedDocViewerObservabilityTracesOverview
+              {...props}
+              indexes={indexes}
+              docViewActions={params.actions}
+            />
           ),
         });
 

src/platform/plugins/shared/unified_doc_viewer/public/components/content_framework/section/section.test.tsx

@@ -8,7 +8,8 @@
  */
 
 import React from 'react';
-import { render, screen, fireEvent } from '@testing-library/react';
+import { render, screen, fireEvent, createEvent } from '@testing-library/react';
+import '@testing-library/jest-dom';
 import userEvent from '@testing-library/user-event';
 import { ContentFrameworkSection, type ContentFrameworkSectionProps } from './section';
 
@@ -71,6 +72,83 @@ describe('ContentFrameworkSection', () => {
     expect(defaultProps.actions?.[1].onClick).toHaveBeenCalled();
   });
 
+  it('prefers onClick over href on plain left click', () => {
+    const onClick = jest.fn();
+    render(
+      <ContentFrameworkSection
+        {...defaultProps}
+        actions={[
+          {
+            icon: 'discoverApp',
+            ariaLabel: 'Open in Discover',
+            dataTestSubj: 'unifiedDocViewerSectionActionButton-openInDiscover',
+            label: 'Open in Discover',
+            href: '/app/discover',
+            onClick,
+          },
+        ]}
+      />
+    );
+
+    const button = screen.getByTestId('unifiedDocViewerSectionActionButton-openInDiscover');
+    const clickEvent = createEvent.click(button, { button: 0 });
+    fireEvent(button, clickEvent);
+
+    expect(onClick).toHaveBeenCalledTimes(1);
+    expect(clickEvent.defaultPrevented).toBe(true);
+  });
+
+  it('does not intercept modifier click when href is present', () => {
+    const onClick = jest.fn();
+    render(
+      <ContentFrameworkSection
+        {...defaultProps}
+        actions={[
+          {
+            icon: 'discoverApp',
+            ariaLabel: 'Open in Discover',
+            dataTestSubj: 'unifiedDocViewerSectionActionButton-openInDiscover',
+            label: 'Open in Discover',
+            href: '/app/discover',
+            onClick,
+          },
+        ]}
+      />
+    );
+
+    const button = screen.getByTestId('unifiedDocViewerSectionActionButton-openInDiscover');
+    const ctrlClickEvent = createEvent.click(button, { button: 0, ctrlKey: true });
+    fireEvent(button, ctrlClickEvent);
+
+    expect(onClick).not.toHaveBeenCalled();
+    expect(ctrlClickEvent.defaultPrevented).toBe(false);
+  });
+
+  it('does not intercept middle click when href is present', () => {
+    const onClick = jest.fn();
+    render(
+      <ContentFrameworkSection
+        {...defaultProps}
+        actions={[
+          {
+            icon: 'discoverApp',
+            ariaLabel: 'Open in Discover',
+            dataTestSubj: 'unifiedDocViewerSectionActionButton-openInDiscoverIcon',
+            href: '/app/discover',
+            onClick,
+          },
+        ]}
+      />
+    );
+
+    const button = screen.getByTestId('unifiedDocViewerSectionActionButton-openInDiscoverIcon');
+    const middleClickEvent = createEvent.click(button, { button: 1 });
+    fireEvent(button, middleClickEvent);
+
+    expect(onClick).not.toHaveBeenCalled();
+    expect(middleClickEvent.defaultPrevented).toBe(false);
+  });
+
   it('renders children inside the panel', () => {
     render(<ContentFrameworkSection {...defaultProps} />);
     expect(screen.getByText('Section children')).toBeInTheDocument();

src/platform/plugins/shared/unified_doc_viewer/public/components/content_framework/section/section_actions.tsx

@@ -20,13 +20,17 @@ interface BaseAction {
 }
 
 export type Action =
-  | (BaseAction & { onClick: () => void; href?: never })
-  | (BaseAction & { href: string; onClick?: never });
+  | (BaseAction & { onClick: () => void; href?: string })
+  | (BaseAction & { href: string; onClick?: () => void });
 
 export interface SectionActionsProps {
   actions: Action[];
 }
 
+function isPlainLeftClick(e: React.MouseEvent) {
+  return e.button === 0 && !e.metaKey && !e.ctrlKey && !e.shiftKey && !e.altKey;
+}
+
 export const SectionActions = ({ actions }: SectionActionsProps) => {
   if (!actions.length) return null;
   const size = 'xs';
@@ -35,7 +39,20 @@ export const SectionActions = ({ actions }: SectionActionsProps) => {
     <EuiFlexGroup gutterSize="s" justifyContent="flexEnd" alignItems="center">
       {actions.map((action, idx) => {
         const { icon, ariaLabel, dataTestSubj, label, onClick, href } = action;
-        const buttonProps = onClick ? { onClick } : { href };
+        const handleClick = onClick
+          ? (e: React.MouseEvent) => {
+              // If we have an href, keep native link behaviour for right clicks and modifier clicks.
+              // Plain left click should run the provided handler instead.
+              if (href && !isPlainLeftClick(e)) return;
+              if (href) e.preventDefault();
+              onClick();
+            }
+          : undefined;
+
+        const buttonProps = {
+          href,
+          onClick: handleClick,
+        };
 
         return (
           <EuiFlexItem grow={false} key={action.id ?? idx} id={action.id}>

src/platform/plugins/shared/unified_doc_viewer/public/components/doc_viewer_logs_overview/logs_overview.tsx

@@ -25,6 +25,7 @@ import type {
 import type { LogDocument, ObservabilityIndexes } from '@kbn/discover-utils/src';
 import { getStacktraceFields } from '@kbn/discover-utils/src';
 import { css } from '@emotion/react';
+import type { DocViewActions } from '@kbn/unified-doc-viewer/src/services/types';
 import { LogsOverviewHeader } from './logs_overview_header';
 import { FieldActionsProvider } from '../../hooks/use_field_actions';
 import { getUnifiedDocViewerServices } from '../../plugin';
@@ -39,6 +40,7 @@ import { TraceWaterfall } from '../observability/traces/components/trace_waterfa
 import { DataSourcesProvider } from '../../hooks/use_data_sources';
 import { SimilarErrors } from './sub_components/similar_errors';
 import { hasErrorFields } from './utils/has_error_fields';
+import { DocViewerExtensionActionsProvider } from '../../hooks/use_doc_viewer_extension_actions';
 
 export type LogsOverviewProps = DocViewRenderProps & {
   renderAIAssistant?: ObservabilityLogsAIAssistantFeature['render'];
@@ -47,6 +49,7 @@ export type LogsOverviewProps = DocViewRenderProps & {
   renderFlyoutStreamProcessingLink?: ObservabilityStreamsFeature['renderFlyoutStreamProcessingLink'];
   indexes: ObservabilityIndexes;
   showTraceWaterfall?: boolean;
+  docViewActions?: DocViewActions;
 };
 
 export interface LogsOverviewApi {
@@ -69,6 +72,7 @@ export const LogsOverview = forwardRef<LogsOverviewApi, LogsOverviewProps>(
       renderFlyoutStreamProcessingLink,
       indexes,
       showTraceWaterfall = true,
+      docViewActions,
     },
     ref
   ) => {
@@ -131,24 +135,28 @@ export const LogsOverview = forwardRef<LogsOverviewApi, LogsOverviewProps>(
             dataView={dataView}
           />
           <DataSourcesProvider indexes={indexes}>
-            {showSimilarErrors ? <SimilarErrors hit={hit} /> : null}
-            <div>{renderFlyoutStreamField && renderFlyoutStreamField({ dataView, doc: hit })}</div>
-            <LogsOverviewDegradedFields ref={qualityIssuesSectionRef} rawDoc={hit.raw} />
-            {isStacktraceAvailable && (
-              <LogsOverviewStacktraceSection
-                ref={stackTraceSectionRef}
-                hit={hit}
-                dataView={dataView}
-              />
-            )}
-            {traceId && showTraceWaterfall ? (
-              <TraceWaterfall
-                traceId={traceId}
-                docId={parsedDoc[TRANSACTION_ID_FIELD] || parsedDoc[SPAN_ID_FIELD]}
-                serviceName={parsedDoc[SERVICE_NAME_FIELD]}
-                dataView={dataView}
-              />
-            ) : null}
+            <DocViewerExtensionActionsProvider actions={docViewActions}>
+              {showSimilarErrors ? <SimilarErrors hit={hit} /> : null}
+              <div>
+                {renderFlyoutStreamField && renderFlyoutStreamField({ dataView, doc: hit })}
+              </div>
+              <LogsOverviewDegradedFields ref={qualityIssuesSectionRef} rawDoc={hit.raw} />
+              {isStacktraceAvailable && (
+                <LogsOverviewStacktraceSection
+                  ref={stackTraceSectionRef}
+                  hit={hit}
+                  dataView={dataView}
+                />
+              )}
+              {traceId && showTraceWaterfall ? (
+                <TraceWaterfall
+                  traceId={traceId}
+                  docId={parsedDoc[TRANSACTION_ID_FIELD] || parsedDoc[SPAN_ID_FIELD]}
+                  serviceName={parsedDoc[SERVICE_NAME_FIELD]}
+                  dataView={dataView}
+                />
+              ) : null}
+            </DocViewerExtensionActionsProvider>
           </DataSourcesProvider>
           {LogsOverviewAIAssistant && <LogsOverviewAIAssistant doc={hit} />}
           <EuiSpacer size="m" />