pass extra filters to Lens

angorayc · Jan 3, 2023 · 73e17de · 73e17de
1 parent 789c0c8
commit 73e17de
Show file tree

Hide file tree

Showing 13 changed files with 29 additions and 161 deletions.
diff --git a/x-pack/plugins/security_solution/public/common/components/alerts_treemap_panel/index.tsx b/x-pack/plugins/security_solution/public/common/components/alerts_treemap_panel/index.tsx
@@ -31,7 +31,6 @@ import { useRefetchByRestartingSession } from '../page/use_refetch_by_session';
 import { LensEmbeddable } from '../visualization_actions/lens_embeddable';
 import { getAlertsTreemapLensAttributes as getLensAttributes } from '../visualization_actions/lens_attributes/common/alerts/alerts_treemap';
 import { SourcererScopeName } from '../../store/sourcerer/model';
-import type { Status } from '../../../../common/detection_engine/schemas/common';
 
 const DEFAULT_HEIGHT = DEFAULT_MIN_CHART_HEIGHT + 134; // px
 
@@ -56,15 +55,12 @@ export interface Props {
   setStackByField0ComboboxInputRef?: (inputRef: HTMLInputElement | null) => void;
   setStackByField1: (stackBy: string | undefined) => void;
   setStackByField1ComboboxInputRef?: (inputRef: HTMLInputElement | null) => void;
-  showBuildingBlockAlerts: boolean;
-  showOnlyThreatIndicatorAlerts: boolean;
   signalIndexName: string | null;
   stackByField0: string;
   stackByField0ComboboxRef?: React.RefObject<EuiComboBox<string | number | string[] | undefined>>;
   stackByField1: string | undefined;
   stackByField1ComboboxRef?: React.RefObject<EuiComboBox<string | number | string[] | undefined>>;
   stackByWidth?: number;
-  status: Status;
   title: React.ReactNode;
 }
 
@@ -85,15 +81,12 @@ const AlertsTreemapPanelComponent: React.FC<Props> = ({
   setStackByField0ComboboxInputRef,
   setStackByField1,
   setStackByField1ComboboxInputRef,
-  showBuildingBlockAlerts,
-  showOnlyThreatIndicatorAlerts,
   signalIndexName,
   stackByField0,
   stackByField0ComboboxRef,
   stackByField1,
   stackByField1ComboboxRef,
   stackByWidth,
-  status,
   title,
 }: Props) => {
   const { to, from, deleteQuery, setQuery } = useGlobalTime(false);
@@ -109,11 +102,9 @@ const AlertsTreemapPanelComponent: React.FC<Props> = ({
   const extraVisualizationOptions = useMemo(
     () => ({
       breakdownField: stackByField1,
-      showBuildingBlockAlerts,
-      showOnlyThreatIndicatorAlerts,
-      status,
+      filters,
     }),
-    [showBuildingBlockAlerts, showOnlyThreatIndicatorAlerts, status, stackByField1]
+    [stackByField1, filters]
   );
 
   const additionalFilters = useMemo(() => {

diff --git a/x-pack/plugins/security_solution/public/common/components/charts/donutchart.tsx b/x-pack/plugins/security_solution/public/common/components/charts/donutchart.tsx
@@ -9,7 +9,7 @@ import type { EuiFlexGroupProps } from '@elastic/eui';
 import { EuiFlexGroup, EuiFlexItem, EuiText, EuiToolTip, useEuiTheme } from '@elastic/eui';
 import React, { useMemo } from 'react';
 
-import type { Datum, NodeColorAccessor, PartialTheme } from '@elastic/charts';
+import type { Datum, NodeColorAccessor, PartialTheme, ElementClickListener } from '@elastic/charts';
 import {
   Chart,
   Partition,
@@ -47,6 +47,7 @@ export interface DonutChartProps {
   height?: number;
   label: React.ReactElement | string;
   legendItems?: LegendItem[] | null | undefined;
+  onElementClick?: ElementClickListener;
   title: React.ReactElement | string | number | null;
   totalCount: number | null | undefined;
 }
@@ -129,10 +130,11 @@ export const DonutChartWrapper = React.memo(DonutChartWrapperComponent);
 
 export const DonutChart = ({
   data,
-  height = 90,
   fillColor,
+  height = 90,
   label,
   legendItems,
+  onElementClick,
   title,
   totalCount,
 }: DonutChartProps) => {
@@ -145,7 +147,7 @@ export const DonutChart = ({
           <DonutChartEmpty size={height} />
         ) : (
           <Chart size={height}>
-            <Settings theme={donutTheme} baseTheme={theme} />
+            <Settings theme={donutTheme} baseTheme={theme} onElementClick={onElementClick} />
             <Partition
               id="donut-chart"
               data={data}

diff --git a/...common/components/visualization_actions/lens_attributes/common/alerts/alerts_histogram.ts b/...common/components/visualization_actions/lens_attributes/common/alerts/alerts_histogram.ts
@@ -6,14 +6,10 @@
  */
 
 import type { GetLensAttributes, LensAttributes } from '../../../types';
-import { buildAlertsOptionsFilters } from './utils';
 
 export const getAlertsHistogramLensAttributes: GetLensAttributes = (
   stackByField = 'kibana.alert.rule.name',
-  extraOptions = {
-    showOnlyThreatIndicatorAlerts: false,
-    showBuildingBlockAlerts: false,
-  }
+  extraOptions
 ) =>
   ({
     title: 'Alerts',
@@ -58,7 +54,7 @@ export const getAlertsHistogramLensAttributes: GetLensAttributes = (
         query: '',
         language: 'kuery',
       },
-      filters: buildAlertsOptionsFilters(extraOptions),
+      filters: extraOptions?.filters ? extraOptions.filters : [],
       datasourceStates: {
         formBased: {
           layers: {

diff --git a/...lic/common/components/visualization_actions/lens_attributes/common/alerts/alerts_table.ts b/...lic/common/components/visualization_actions/lens_attributes/common/alerts/alerts_table.ts
@@ -5,14 +5,10 @@
  * 2.0.
  */
 import type { GetLensAttributes } from '../../../types';
-import { buildAlertsOptionsFilters } from './utils';
 
 export const getAlertsTableLensAttributes: GetLensAttributes = (
   stackByField = 'kibana.alert.rule.name',
-  extraOptions = {
-    showOnlyThreatIndicatorAlerts: false,
-    showBuildingBlockAlerts: false,
-  }
+  extraOptions
 ) => ({
   title: 'Alerts',
   description: '',
@@ -45,7 +41,7 @@ export const getAlertsTableLensAttributes: GetLensAttributes = (
       query: '',
       language: 'kuery',
     },
-    filters: buildAlertsOptionsFilters(extraOptions),
+    filters: extraOptions?.filters ? extraOptions.filters : [],
     datasourceStates: {
       formBased: {
         layers: {
@@ -77,22 +73,22 @@ export const getAlertsTableLensAttributes: GetLensAttributes = (
                 },
               },
               'f04a71a3-399f-4d32-9efc-8a005e989991': {
-                label: `Count of ${extraOptions.breakdownField}`,
+                label: `Count of ${extraOptions?.breakdownField}`,
                 dataType: 'number',
                 operationType: 'count',
                 isBucketed: false,
                 scale: 'ratio',
-                sourceField: extraOptions.breakdownField,
+                sourceField: extraOptions?.breakdownField,
                 params: {
                   emptyAsNull: true,
                 },
               },
               '75ce269b-ee9c-4c7d-a14e-9226ba0fe059': {
-                label: `Top values of ${extraOptions.breakdownField}`,
+                label: `Top values of ${extraOptions?.breakdownField}`,
                 dataType: 'string',
                 operationType: 'terms',
                 scale: 'ordinal',
-                sourceField: extraOptions.breakdownField,
+                sourceField: extraOptions?.breakdownField,
                 isBucketed: true,
                 params: {
                   size: 1000,

diff --git a/...c/common/components/visualization_actions/lens_attributes/common/alerts/alerts_treemap.ts b/...c/common/components/visualization_actions/lens_attributes/common/alerts/alerts_treemap.ts
@@ -5,14 +5,10 @@
  * 2.0.
  */
 import type { GetLensAttributes } from '../../../types';
-import { buildAlertsOptionsFilters } from './utils';
 
 export const getAlertsTreemapLensAttributes: GetLensAttributes = (
   stackByField = 'kibana.alert.rule.name',
-  extraOptions = {
-    showOnlyThreatIndicatorAlerts: false,
-    showBuildingBlockAlerts: false,
-  }
+  extraOptions
 ) => ({
   title: 'Alerts',
   description: '',
@@ -42,7 +38,7 @@ export const getAlertsTreemapLensAttributes: GetLensAttributes = (
       query: '',
       language: 'kuery',
     },
-    filters: buildAlertsOptionsFilters(extraOptions),
+    filters: extraOptions?.filters ? extraOptions.filters : [],
     datasourceStates: {
       formBased: {
         layers: {
@@ -74,11 +70,11 @@ export const getAlertsTreemapLensAttributes: GetLensAttributes = (
                 },
               },
               '75ce269b-ee9c-4c7d-a14e-9226ba0fe059': {
-                label: `Top values of ${extraOptions.breakdownField}`,
+                label: `Top values of ${extraOptions?.breakdownField}`,
                 dataType: 'string',
                 operationType: 'terms',
                 scale: 'ordinal',
-                sourceField: extraOptions.breakdownField,
+                sourceField: extraOptions?.breakdownField,
                 isBucketed: true,
                 params: {
                   size: 1000,

diff --git a/...ion/public/common/components/visualization_actions/lens_attributes/common/alerts/utils.ts b/...ion/public/common/components/visualization_actions/lens_attributes/common/alerts/utils.ts
diff --git a/...gins/security_solution/public/common/components/visualization_actions/lens_embeddable.tsx b/...gins/security_solution/public/common/components/visualization_actions/lens_embeddable.tsx
@@ -51,19 +51,19 @@ const initVisualizationData: {
 const style = { height: '100%', minWidth: '100px' };
 
 const LensEmbeddableComponent: React.FC<LensEmbeddableComponentProps> = ({
-  extraOptions,
   extraActions,
+  extraOptions,
   getLensAttributes,
   height: wrapperHeight,
-  width: wrapperWidth,
   id,
   inputsModelId = InputsModelId.global,
   inspectTitle,
   lensAttributes,
+  onLoad,
   scopeId = SourcererScopeName.default,
   stackByField,
   timerange,
-  onLoad,
+  width: wrapperWidth,
 }) => {
   const { lens } = useKibana().services;
   const dispatch = useDispatch();

diff --git a/x-pack/plugins/security_solution/public/common/components/visualization_actions/types.ts b/x-pack/plugins/security_solution/public/common/components/visualization_actions/types.ts
@@ -7,10 +7,11 @@
 
 import type { TypedLensByValueInput } from '@kbn/lens-plugin/public';
 import type { Action } from '@kbn/ui-actions-plugin/public';
+import type { Filter } from '@kbn/es-query';
 
-import type { Status } from '../../../../common/detection_engine/schemas/common';
 import type { InputsModelId } from '../../store/inputs/constants';
 import type { SourcererScopeName } from '../../store/sourcerer/model';
+import type { Status } from '../../../../common/detection_engine/schemas/common';
 
 export type LensAttributes = TypedLensByValueInput['attributes'];
 export type GetLensAttributes = (
@@ -98,9 +99,8 @@ export interface Response {
 
 export interface ExtraOptions {
   breakdownField?: string;
+  filters?: Filter[];
   ruleId?: string;
-  showBuildingBlockAlerts?: boolean;
-  showOnlyThreatIndicatorAlerts?: boolean;
   spaceId?: string;
   status?: Status;
 }
diff --git a/.../security_solution/public/common/components/visualization_actions/use_lens_attributes.tsx b/.../security_solution/public/common/components/visualization_actions/use_lens_attributes.tsx
@@ -83,7 +83,6 @@ export const useLensAttributes = ({
     }
 
     const indexFilters = hasAdHocDataViews ? [] : getIndexFilters(selectedPatterns);
-
     return {
       ...attrs,
       ...(title != null ? { title } : {}),

diff --git a/...s/security_solution/public/detections/components/alerts_kpis/alerts_count_panel/index.tsx b/...s/security_solution/public/detections/components/alerts_kpis/alerts_count_panel/index.tsx
@@ -51,15 +51,12 @@ interface AlertsCountPanelProps {
   setStackByField0ComboboxInputRef?: (inputRef: HTMLInputElement | null) => void;
   setStackByField1: (stackBy: string | undefined) => void;
   setStackByField1ComboboxInputRef?: (inputRef: HTMLInputElement | null) => void;
-  showBuildingBlockAlerts: boolean;
-  showOnlyThreatIndicatorAlerts: boolean;
   signalIndexName: string | null;
   stackByField0: string;
   stackByField0ComboboxRef?: React.RefObject<EuiComboBox<string | number | string[] | undefined>>;
   stackByField1: string | undefined;
   stackByField1ComboboxRef?: React.RefObject<EuiComboBox<string | number | string[] | undefined>>;
   stackByWidth?: number;
-  status: Status;
   title?: React.ReactNode;
 }
 const ChartHeight = '180px';
@@ -78,15 +75,12 @@ export const AlertsCountPanel = memo<AlertsCountPanelProps>(
     setStackByField0ComboboxInputRef,
     setStackByField1,
     setStackByField1ComboboxInputRef,
-    showBuildingBlockAlerts,
-    showOnlyThreatIndicatorAlerts,
     signalIndexName,
     stackByField0,
     stackByField0ComboboxRef,
     stackByField1,
     stackByField1ComboboxRef,
     stackByWidth,
-    status,
     title = i18n.COUNT_TABLE_TITLE,
   }) => {
     const { to, from, deleteQuery, setQuery } = useGlobalTime(false);
@@ -134,11 +128,9 @@ export const AlertsCountPanel = memo<AlertsCountPanelProps>(
     const extraVisualizationOptions = useMemo(
       () => ({
         breakdownField: stackByField1,
-        showBuildingBlockAlerts,
-        showOnlyThreatIndicatorAlerts,
-        status,
+        filters,
       }),
-      [showBuildingBlockAlerts, showOnlyThreatIndicatorAlerts, stackByField1, status]
+      [filters, stackByField1]
     );
     const {
       loading: isLoadingAlerts,