From 73e17de47526efe1a58331fb159784b0d6ec72ed Mon Sep 17 00:00:00 2001 From: Angela Chuang Date: Tue, 3 Jan 2023 17:38:29 +0000 Subject: [PATCH] pass extra filters to Lens --- .../components/alerts_treemap_panel/index.tsx | 13 +--- .../common/components/charts/donutchart.tsx | 8 +- .../common/alerts/alerts_histogram.ts | 8 +- .../common/alerts/alerts_table.ts | 16 ++-- .../common/alerts/alerts_treemap.ts | 12 +-- .../lens_attributes/common/alerts/utils.ts | 76 ------------------- .../visualization_actions/lens_embeddable.tsx | 6 +- .../components/visualization_actions/types.ts | 6 +- .../use_lens_attributes.tsx | 1 - .../alerts_kpis/alerts_count_panel/index.tsx | 12 +-- .../alerts_histogram_panel/index.tsx | 13 +--- .../detection_engine/chart_panels/index.tsx | 16 ---- .../detection_engine/detection_engine.tsx | 3 - 13 files changed, 29 insertions(+), 161 deletions(-) delete mode 100644 x-pack/plugins/security_solution/public/common/components/visualization_actions/lens_attributes/common/alerts/utils.ts 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 index 096744fd5f5452..9f558951611f1c 100644 --- 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>; stackByField1: string | undefined; stackByField1ComboboxRef?: React.RefObject>; stackByWidth?: number; - status: Status; title: React.ReactNode; } @@ -85,15 +81,12 @@ const AlertsTreemapPanelComponent: React.FC = ({ 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 = ({ 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 index c8d35282d9d859..437544ae393256 100644 --- 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 = ({ ) : ( - + ({ 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/x-pack/plugins/security_solution/public/common/components/visualization_actions/lens_attributes/common/alerts/alerts_table.ts b/x-pack/plugins/security_solution/public/common/components/visualization_actions/lens_attributes/common/alerts/alerts_table.ts index 1fddb15ec60e8c..cea14505f2ebcb 100644 --- a/x-pack/plugins/security_solution/public/common/components/visualization_actions/lens_attributes/common/alerts/alerts_table.ts +++ b/x-pack/plugins/security_solution/public/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/x-pack/plugins/security_solution/public/common/components/visualization_actions/lens_attributes/common/alerts/alerts_treemap.ts b/x-pack/plugins/security_solution/public/common/components/visualization_actions/lens_attributes/common/alerts/alerts_treemap.ts index 8b6fcb315f578a..719574b6aa724b 100644 --- a/x-pack/plugins/security_solution/public/common/components/visualization_actions/lens_attributes/common/alerts/alerts_treemap.ts +++ b/x-pack/plugins/security_solution/public/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/x-pack/plugins/security_solution/public/common/components/visualization_actions/lens_attributes/common/alerts/utils.ts b/x-pack/plugins/security_solution/public/common/components/visualization_actions/lens_attributes/common/alerts/utils.ts deleted file mode 100644 index 99a1b2363bb1f5..00000000000000 --- a/x-pack/plugins/security_solution/public/common/components/visualization_actions/lens_attributes/common/alerts/utils.ts +++ /dev/null @@ -1,76 +0,0 @@ -/* - * 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; you may not use this file except in compliance with the Elastic License - * 2.0. - */ - -import type { ExtraOptions } from '../../../types'; - -export const buildAlertsOptionsFilters = ({ - showBuildingBlockAlerts = false, - showOnlyThreatIndicatorAlerts = false, - status, -}: ExtraOptions) => [ - ...(status - ? [ - { - meta: { - alias: null, - negate: false, - disabled: false, - type: 'phrase', - key: 'kibana.alert.workflow_status', - params: { - query: status, - }, - }, - query: { - match_phrase: { - 'kibana.alert.workflow_status': status, - }, - }, - }, - ] - : []), - ...(showOnlyThreatIndicatorAlerts - ? [ - { - meta: { - alias: null, - negate: false, - disabled: false, - type: 'phrase', - key: 'kibana.alert.rule.type', - params: { - query: 'threat_match', - }, - }, - query: { - match_phrase: { - 'kibana.alert.rule.type': 'threat_match', - }, - }, - }, - ] - : []), - ...(!showBuildingBlockAlerts - ? [ - { - meta: { - index: '.alerts-security.alerts-id', - alias: null, - negate: true, - disabled: false, - type: 'exists', - key: 'kibana.alert.building_block_type', - }, - query: { - exists: { - field: 'kibana.alert.building_block_type', - }, - }, - }, - ] - : []), -]; diff --git a/x-pack/plugins/security_solution/public/common/components/visualization_actions/lens_embeddable.tsx b/x-pack/plugins/security_solution/public/common/components/visualization_actions/lens_embeddable.tsx index 0725b55a03c8db..e37d8807ea4ef2 100644 --- a/x-pack/plugins/security_solution/public/common/components/visualization_actions/lens_embeddable.tsx +++ b/x-pack/plugins/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 = ({ - 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 index 78738bdac92494..8b0a84f0843961 100644 --- 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/x-pack/plugins/security_solution/public/common/components/visualization_actions/use_lens_attributes.tsx b/x-pack/plugins/security_solution/public/common/components/visualization_actions/use_lens_attributes.tsx index 157f0b6d14929b..b50e2f05b0645a 100644 --- a/x-pack/plugins/security_solution/public/common/components/visualization_actions/use_lens_attributes.tsx +++ b/x-pack/plugins/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/x-pack/plugins/security_solution/public/detections/components/alerts_kpis/alerts_count_panel/index.tsx b/x-pack/plugins/security_solution/public/detections/components/alerts_kpis/alerts_count_panel/index.tsx index 2fa54aeccf50cd..ff4b4b163eeb84 100644 --- a/x-pack/plugins/security_solution/public/detections/components/alerts_kpis/alerts_count_panel/index.tsx +++ b/x-pack/plugins/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>; stackByField1: string | undefined; stackByField1ComboboxRef?: React.RefObject>; stackByWidth?: number; - status: Status; title?: React.ReactNode; } const ChartHeight = '180px'; @@ -78,15 +75,12 @@ export const AlertsCountPanel = memo( 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( const extraVisualizationOptions = useMemo( () => ({ breakdownField: stackByField1, - showBuildingBlockAlerts, - showOnlyThreatIndicatorAlerts, - status, + filters, }), - [showBuildingBlockAlerts, showOnlyThreatIndicatorAlerts, stackByField1, status] + [filters, stackByField1] ); const { loading: isLoadingAlerts, diff --git a/x-pack/plugins/security_solution/public/detections/components/alerts_kpis/alerts_histogram_panel/index.tsx b/x-pack/plugins/security_solution/public/detections/components/alerts_kpis/alerts_histogram_panel/index.tsx index ac1aa5d00423b4..4b6ecd86383076 100644 --- a/x-pack/plugins/security_solution/public/detections/components/alerts_kpis/alerts_histogram_panel/index.tsx +++ b/x-pack/plugins/security_solution/public/detections/components/alerts_kpis/alerts_histogram_panel/index.tsx @@ -57,7 +57,6 @@ import { getAlertsHistogramLensAttributes as getLensAttributes } from '../../../ import { InputsModelId } from '../../../../common/store/inputs/constants'; import { useRefetchByRestartingSession } from '../../../../common/components/page/use_refetch_by_session'; import { SourcererScopeName } from '../../../../common/store/sourcerer/model'; -import type { Status } from '../../../../../common/detection_engine/schemas/common'; import type { EmbeddableData } from '../../../../common/components/visualization_actions/types'; const defaultTotalAlertsObj: AlertsTotal = { @@ -99,18 +98,15 @@ interface AlertsHistogramPanelProps { query?: Query; runtimeMappings?: MappingRuntimeFields; setComboboxInputRef?: (inputRef: HTMLInputElement | null) => void; - showBuildingBlockAlerts: boolean; showCountsInLegend?: boolean; showGroupByPlaceholder?: boolean; showLegend?: boolean; showLinkToAlerts?: boolean; - showOnlyThreatIndicatorAlerts: boolean; showStackBy?: boolean; showTotalAlertsCount?: boolean; signalIndexName: string | null; stackByLabel?: string; stackByWidth?: number; - status?: Status; timelineId?: string; title?: React.ReactNode; titleSize?: EuiTitleSize; @@ -139,18 +135,15 @@ export const AlertsHistogramPanel = memo( query, runtimeMappings, setComboboxInputRef, - showBuildingBlockAlerts, showCountsInLegend = false, showGroupByPlaceholder = false, showLegend = true, showLinkToAlerts = false, - showOnlyThreatIndicatorAlerts, showStackBy = true, showTotalAlertsCount = false, signalIndexName, stackByLabel, stackByWidth, - status, timelineId, title = i18n.HISTOGRAM_HEADER, titleSize = 'm', @@ -203,11 +196,9 @@ export const AlertsHistogramPanel = memo( }); const extraVisualizationOptions = useMemo( () => ({ - showBuildingBlockAlerts, - showOnlyThreatIndicatorAlerts, - status, + filters, }), - [showBuildingBlockAlerts, showOnlyThreatIndicatorAlerts, status] + [filters] ); const { diff --git a/x-pack/plugins/security_solution/public/detections/pages/detection_engine/chart_panels/index.tsx b/x-pack/plugins/security_solution/public/detections/pages/detection_engine/chart_panels/index.tsx index 5e6e76195bc5a2..ee6ba3d0efd356 100644 --- a/x-pack/plugins/security_solution/public/detections/pages/detection_engine/chart_panels/index.tsx +++ b/x-pack/plugins/security_solution/public/detections/pages/detection_engine/chart_panels/index.tsx @@ -29,7 +29,6 @@ import { } from '../../../components/alerts_kpis/common/config'; import { AlertsCountPanel } from '../../../components/alerts_kpis/alerts_count_panel'; import { GROUP_BY_LABEL } from '../../../components/alerts_kpis/common/translations'; -import type { Status } from '../../../../../common/detection_engine/schemas/common'; import { RESET_GROUP_BY_FIELDS } from '../../../../common/components/chart_settings_popover/configurations/default/translations'; const TABLE_PANEL_HEIGHT = 330; // px @@ -53,9 +52,6 @@ export interface Props { runtimeMappings: MappingRuntimeFields; signalIndexName: string | null; updateDateRangeCallback: UpdateDateRange; - showBuildingBlockAlerts: boolean; - showOnlyThreatIndicatorAlerts: boolean; - filterGroup: Status; } const ChartPanelsComponent: React.FC = ({ @@ -66,9 +62,6 @@ const ChartPanelsComponent: React.FC = ({ runtimeMappings, signalIndexName, updateDateRangeCallback, - showBuildingBlockAlerts, - filterGroup, - showOnlyThreatIndicatorAlerts, }: Props) => { const { alertViewSelection, @@ -198,14 +191,11 @@ const ChartPanelsComponent: React.FC = ({ query={query} runtimeMappings={runtimeMappings} setComboboxInputRef={setStackByField0ComboboxInputRef} - showBuildingBlockAlerts={showBuildingBlockAlerts} showCountsInLegend={true} showGroupByPlaceholder={false} - showOnlyThreatIndicatorAlerts={showOnlyThreatIndicatorAlerts} showTotalAlertsCount={false} signalIndexName={signalIndexName} stackByLabel={GROUP_BY_LABEL} - status={filterGroup} title={title} titleSize={'s'} updateDateRange={updateDateRangeCallback} @@ -232,14 +222,11 @@ const ChartPanelsComponent: React.FC = ({ setStackByField0ComboboxInputRef={setStackByField0ComboboxInputRef} setStackByField1={updateCommonStackBy1} setStackByField1ComboboxInputRef={setStackByField1ComboboxInputRef} - showBuildingBlockAlerts={showBuildingBlockAlerts} - showOnlyThreatIndicatorAlerts={showOnlyThreatIndicatorAlerts} signalIndexName={signalIndexName} stackByField0={countTableStackBy0} stackByField0ComboboxRef={stackByField0ComboboxRef} stackByField1={countTableStackBy1} stackByField1ComboboxRef={stackByField1ComboboxRef} - status={filterGroup} title={title} /> )} @@ -267,14 +254,11 @@ const ChartPanelsComponent: React.FC = ({ setStackByField0ComboboxInputRef={setStackByField0ComboboxInputRef} setStackByField1={updateCommonStackBy1} setStackByField1ComboboxInputRef={setStackByField1ComboboxInputRef} - showBuildingBlockAlerts={showBuildingBlockAlerts} - showOnlyThreatIndicatorAlerts={showOnlyThreatIndicatorAlerts} signalIndexName={signalIndexName} stackByField0={riskChartStackBy0} stackByField0ComboboxRef={stackByField0ComboboxRef} stackByField1={riskChartStackBy1} stackByField1ComboboxRef={stackByField1ComboboxRef} - status={filterGroup} title={title} /> )} diff --git a/x-pack/plugins/security_solution/public/detections/pages/detection_engine/detection_engine.tsx b/x-pack/plugins/security_solution/public/detections/pages/detection_engine/detection_engine.tsx index 2f63066c62d5a1..8109cd00cdbcc3 100644 --- a/x-pack/plugins/security_solution/public/detections/pages/detection_engine/detection_engine.tsx +++ b/x-pack/plugins/security_solution/public/detections/pages/detection_engine/detection_engine.tsx @@ -324,12 +324,9 @@ const DetectionEnginePageComponent: React.FC = ()