From 223ea978f02105862b65906edf574a98c963772a Mon Sep 17 00:00:00 2001
From: Pablo Machado <machadoum@gmail.com>
Date: Mon, 9 Oct 2023 15:18:31 +0200
Subject: [PATCH] [Security Solutions] Fix show top modal opened inside
 timeline shows no result (#168339)

issue: https://github.com/elastic/kibana/issues/168204

## Summary

Fix show top modal opened inside timeline shows no result.

### Summary:
The TopN graph didn't take the timeline sorcerer scope into account. So
it didn't display alert data.
After https://github.com/elastic/kibana/pull/165109 got merged, we
started filtering the TopN graph by the timeline query. That made the
current bug noticeable because we can filter by alert ID.

The fix is to provide the `sourcererScopeId` to the graph.


Screenshot after the change:
<img width="889" alt="Screenshot 2023-10-09 at 13 04 42"
src="https://github.com/elastic/kibana/assets/1490444/f41b941f-66f3-470b-b463-c0d45ab74d1f">


### Extra
* Delete unused prop `applyGlobalQueriesAndFilters`

### Checklist

Delete any items that are not applicable to this PR.

- [ ] [Unit or functional
tests](https://www.elastic.co/guide/en/kibana/master/development-tests.html)
were updated or added to match the most common scenarios
---
 .../public/common/components/matrix_histogram/index.tsx    | 4 ++++
 .../public/common/components/top_n/top_n.tsx               | 7 +++----
 .../public/overview/components/events_by_dataset/index.tsx | 6 ++++--
 3 files changed, 11 insertions(+), 6 deletions(-)

diff --git a/x-pack/plugins/security_solution/public/common/components/matrix_histogram/index.tsx b/x-pack/plugins/security_solution/public/common/components/matrix_histogram/index.tsx
index e14a0c7f4c224..761a3e597cadd 100644
--- a/x-pack/plugins/security_solution/public/common/components/matrix_histogram/index.tsx
+++ b/x-pack/plugins/security_solution/public/common/components/matrix_histogram/index.tsx
@@ -43,6 +43,7 @@ import { VISUALIZATION_ACTIONS_BUTTON_CLASS } from '../visualization_actions/uti
 import { VisualizationEmbeddable } from '../visualization_actions/visualization_embeddable';
 import { MatrixHistogramChartContent } from './chart_content';
 import { useVisualizationResponse } from '../visualization_actions/use_visualization_response';
+import type { SourcererScopeName } from '../../store/sourcerer/model';
 
 export type MatrixHistogramComponentProps = MatrixHistogramProps &
   Omit<MatrixHistogramQueryProps, 'stackByField'> & {
@@ -65,6 +66,7 @@ export type MatrixHistogramComponentProps = MatrixHistogramProps &
     stackByOptions: MatrixHistogramOption[];
     subtitle?: string | GetSubTitle;
     scopeId?: string;
+    sourcererScopeId?: SourcererScopeName;
     title: string | GetTitle;
     hideQueryToggle?: boolean;
     applyGlobalQueriesAndFilters?: boolean;
@@ -114,6 +116,7 @@ export const MatrixHistogramComponent: React.FC<MatrixHistogramComponentProps> =
   startDate,
   subtitle,
   scopeId,
+  sourcererScopeId,
   title,
   titleSize,
   yTickFormatter,
@@ -343,6 +346,7 @@ export const MatrixHistogramComponent: React.FC<MatrixHistogramComponentProps> =
           {toggleStatus ? (
             isChartEmbeddablesEnabled ? (
               <VisualizationEmbeddable
+                scopeId={sourcererScopeId}
                 applyGlobalQueriesAndFilters={applyGlobalQueriesAndFilters}
                 data-test-subj="embeddable-matrix-histogram"
                 extraOptions={extraVisualizationOptions}
diff --git a/x-pack/plugins/security_solution/public/common/components/top_n/top_n.tsx b/x-pack/plugins/security_solution/public/common/components/top_n/top_n.tsx
index 742cfafea6dcc..a93c3fd386382 100644
--- a/x-pack/plugins/security_solution/public/common/components/top_n/top_n.tsx
+++ b/x-pack/plugins/security_solution/public/common/components/top_n/top_n.tsx
@@ -83,9 +83,8 @@ const TopNComponent: React.FC<Props> = ({
     (value: string) => setView(value as TimelineEventsType),
     [setView]
   );
-  const { selectedPatterns, runtimeMappings } = useSourcererDataView(
-    getSourcererScopeName({ scopeId, view })
-  );
+  const sourcererScopeId = getSourcererScopeName({ scopeId, view });
+  const { selectedPatterns, runtimeMappings } = useSourcererDataView(sourcererScopeId);
 
   useEffect(() => {
     setView(defaultView);
@@ -116,7 +115,6 @@ const TopNComponent: React.FC<Props> = ({
       <TopNContent>
         {view === 'raw' || view === 'all' ? (
           <EventsByDataset
-            applyGlobalQueriesAndFilters={false} // Global filters are already included in combinedQueries
             combinedQueries={combinedQueries}
             deleteQuery={deleteQuery}
             filters={applicableFilters}
@@ -135,6 +133,7 @@ const TopNComponent: React.FC<Props> = ({
             showSpacer={false}
             toggleTopN={toggleTopN}
             scopeId={scopeId}
+            sourcererScopeId={sourcererScopeId}
             to={to}
             hideQueryToggle
           />
diff --git a/x-pack/plugins/security_solution/public/overview/components/events_by_dataset/index.tsx b/x-pack/plugins/security_solution/public/overview/components/events_by_dataset/index.tsx
index b8592df20b3b5..9a62b29aa411c 100644
--- a/x-pack/plugins/security_solution/public/overview/components/events_by_dataset/index.tsx
+++ b/x-pack/plugins/security_solution/public/overview/components/events_by_dataset/index.tsx
@@ -37,6 +37,7 @@ import * as i18n from '../../pages/translations';
 import { SecurityPageName } from '../../../app/types';
 import { useFormatUrl } from '../../../common/components/link_to';
 import { useInvalidFilterQuery } from '../../../common/hooks/use_invalid_filter_query';
+import type { SourcererScopeName } from '../../../common/store/sourcerer/model';
 
 const DEFAULT_STACK_BY = 'event.dataset';
 
@@ -61,7 +62,7 @@ interface Props extends Pick<GlobalTimeArgs, 'from' | 'to' | 'deleteQuery' | 'se
   scopeId?: string;
   toggleTopN?: () => void;
   hideQueryToggle?: boolean;
-  applyGlobalQueriesAndFilters?: boolean;
+  sourcererScopeId?: SourcererScopeName;
 }
 
 const getHistogramOption = (fieldName: string): MatrixHistogramOption => ({
@@ -94,10 +95,10 @@ const EventsByDatasetComponent: React.FC<Props> = ({
   showLegend,
   showSpacer = true,
   scopeId,
+  sourcererScopeId,
   to,
   toggleTopN,
   hideQueryToggle = false,
-  applyGlobalQueriesAndFilters = true,
 }) => {
   const uniqueQueryId = useMemo(() => `${ID}-${queryType}`, [queryType]);
 
@@ -206,6 +207,7 @@ const EventsByDatasetComponent: React.FC<Props> = ({
       skip={filterQuery === undefined}
       startDate={from}
       scopeId={scopeId}
+      sourcererScopeId={sourcererScopeId}
       {...eventsByDatasetHistogramConfigs}
       title={onlyField != null ? i18n.TOP(onlyField) : eventsByDatasetHistogramConfigs.title}
       chartHeight={CHART_HEIGHT}