From 1e7d699c1227a3b8bfe43c9c1597d2516198b855 Mon Sep 17 00:00:00 2001 From: Davis McPhee Date: Thu, 20 Oct 2022 21:28:16 -0300 Subject: [PATCH 1/2] [Discover] Add types to es_query metadata --- .../top_nav/open_alerts_popover.tsx | 19 +++++++++--------- .../components/data_view_select_popover.tsx | 20 +++++++++---------- .../expression/es_query_expression.tsx | 4 ++-- .../es_query/expression/expression.tsx | 6 +++--- .../expression/search_source_expression.tsx | 5 +++-- .../search_source_expression_form.tsx | 6 +++--- .../public/alert_types/es_query/types.ts | 5 +++++ 7 files changed, 35 insertions(+), 30 deletions(-) diff --git a/src/plugins/discover/public/application/main/components/top_nav/open_alerts_popover.tsx b/src/plugins/discover/public/application/main/components/top_nav/open_alerts_popover.tsx index e0c8f39b8a0ce..bf484452b731f 100644 --- a/src/plugins/discover/public/application/main/components/top_nav/open_alerts_popover.tsx +++ b/src/plugins/discover/public/application/main/components/top_nav/open_alerts_popover.tsx @@ -19,10 +19,6 @@ import { updateSearchSource } from '../../utils/update_search_source'; const container = document.createElement('div'); let isOpen = false; -interface DiscoverAlertMetadata { - adHocDataViewList: DataView[]; -} - const ALERT_TYPE_ID = '.es-query'; interface AlertsPopoverProps { @@ -36,6 +32,11 @@ interface AlertsPopoverProps { updateDataViewList: (dataViews: DataView[]) => Promise; } +interface EsQueryAlertMetaData { + isManagementPage?: boolean; + adHocDataViewList: DataView[]; +} + export function AlertsPopover({ searchSource, anchorElement, @@ -72,10 +73,10 @@ export function AlertsPopover({ }; }, [savedQueryId, searchSource, services]); - const discoverMetadata: DiscoverAlertMetadata = useMemo( + const discoverMetadata: EsQueryAlertMetaData = useMemo( () => ({ + isManagementPage: false, adHocDataViewList: adHocDataViews, - savedDataViewList: [], // might be filled while in flyout }), [adHocDataViews] ); @@ -85,7 +86,7 @@ export function AlertsPopover({ return; } - const onFinishFlyoutInteraction = (metadata: DiscoverAlertMetadata) => { + const onFinishFlyoutInteraction = (metadata: EsQueryAlertMetaData) => { updateDataViewList(metadata.adHocDataViewList); }; @@ -93,11 +94,11 @@ export function AlertsPopover({ metadata: discoverMetadata, consumer: 'discover', onClose: (_, metadata) => { - onFinishFlyoutInteraction(metadata as DiscoverAlertMetadata); + onFinishFlyoutInteraction(metadata as EsQueryAlertMetaData); onClose(); }, onSave: async (metadata) => { - onFinishFlyoutInteraction(metadata as DiscoverAlertMetadata); + onFinishFlyoutInteraction(metadata as EsQueryAlertMetaData); }, canChangeTrigger: false, ruleTypeId: ALERT_TYPE_ID, diff --git a/x-pack/plugins/stack_alerts/public/alert_types/components/data_view_select_popover.tsx b/x-pack/plugins/stack_alerts/public/alert_types/components/data_view_select_popover.tsx index 34c5bff69f7fc..5d374bace360c 100644 --- a/x-pack/plugins/stack_alerts/public/alert_types/components/data_view_select_popover.tsx +++ b/x-pack/plugins/stack_alerts/public/alert_types/components/data_view_select_popover.tsx @@ -24,16 +24,15 @@ import type { DataViewListItem, DataView } from '@kbn/data-views-plugin/public'; import { DataViewSelector } from '@kbn/unified-search-plugin/public'; import { useTriggerUiActionServices } from '../es_query/util'; -interface DiscoverAlertMetadata { +export interface DataViewSelectPopoverMetaData extends Record { adHocDataViewList: DataView[]; - [key: string]: unknown; } export interface DataViewSelectPopoverProps { dataView: DataView; - metadata?: Record; + metadata?: DataViewSelectPopoverMetaData; onSelectDataView: (selectedDataView: DataView) => void; - onChangeMetaData: (metadata: Record) => void; + onChangeMetaData: (metadata: DataViewSelectPopoverMetaData) => void; } const toDataViewListItem = (dataView: DataView): DataViewListItem => { @@ -45,21 +44,20 @@ const toDataViewListItem = (dataView: DataView): DataViewListItem => { }; export const DataViewSelectPopover: React.FunctionComponent = ({ - metadata = { adHocDataViewList: [], savedDataViewList: [] }, + metadata = { adHocDataViewList: [] }, dataView, onSelectDataView, onChangeMetaData, }) => { const { dataViews, dataViewEditor } = useTriggerUiActionServices(); - const context = metadata as DiscoverAlertMetadata; const [dataViewItems, setDataViewsItems] = useState([]); const [dataViewPopoverOpen, setDataViewPopoverOpen] = useState(false); const closeDataViewEditor = useRef<() => void | undefined>(); const allDataViewItems = useMemo( - () => [...dataViewItems, ...context.adHocDataViewList.map(toDataViewListItem)], - [context.adHocDataViewList, dataViewItems] + () => [...dataViewItems, ...metadata.adHocDataViewList.map(toDataViewListItem)], + [dataViewItems, metadata.adHocDataViewList] ); const closeDataViewPopover = useCallback(() => setDataViewPopoverOpen(false), []); @@ -83,11 +81,11 @@ export const DataViewSelectPopover: React.FunctionComponent { onChangeMetaData({ - ...context, - adHocDataViewList: [...context.adHocDataViewList, toDataViewListItem(adHocDataView)], + ...metadata, + adHocDataViewList: [...metadata.adHocDataViewList, adHocDataView], }); }, - [context, onChangeMetaData] + [metadata, onChangeMetaData] ); const createDataView = useMemo( diff --git a/x-pack/plugins/stack_alerts/public/alert_types/es_query/expression/es_query_expression.tsx b/x-pack/plugins/stack_alerts/public/alert_types/es_query/expression/es_query_expression.tsx index 37369d60335a5..6694dc2b76980 100644 --- a/x-pack/plugins/stack_alerts/public/alert_types/es_query/expression/es_query_expression.tsx +++ b/x-pack/plugins/stack_alerts/public/alert_types/es_query/expression/es_query_expression.tsx @@ -19,7 +19,7 @@ import { getFields, RuleTypeParamsExpressionProps } from '@kbn/triggers-actions- import { parseDuration } from '@kbn/alerting-plugin/common'; import { hasExpressionValidationErrors } from '../validation'; import { buildSortedEventsQuery } from '../../../../common/build_sorted_events_query'; -import { EsQueryAlertParams, SearchType } from '../types'; +import { EsQueryAlertMetaData, EsQueryAlertParams, SearchType } from '../types'; import { IndexSelectPopover } from '../../components/index_select_popover'; import { DEFAULT_VALUES } from '../constants'; import { RuleCommonExpressions } from '../rule_common_expressions'; @@ -33,7 +33,7 @@ interface KibanaDeps { } export const EsQueryExpression: React.FC< - RuleTypeParamsExpressionProps> + RuleTypeParamsExpressionProps, EsQueryAlertMetaData> > = ({ ruleParams, setRuleParams, setRuleProperty, errors, data }) => { const { index, diff --git a/x-pack/plugins/stack_alerts/public/alert_types/es_query/expression/expression.tsx b/x-pack/plugins/stack_alerts/public/alert_types/es_query/expression/expression.tsx index a5d1ec9552d5d..17ebd337468b9 100644 --- a/x-pack/plugins/stack_alerts/public/alert_types/es_query/expression/expression.tsx +++ b/x-pack/plugins/stack_alerts/public/alert_types/es_query/expression/expression.tsx @@ -11,7 +11,7 @@ import 'brace/theme/github'; import { EuiCallOut, EuiHorizontalRule, EuiSpacer } from '@elastic/eui'; import { i18n } from '@kbn/i18n'; import { RuleTypeParamsExpressionProps } from '@kbn/triggers-actions-ui-plugin/public'; -import { EsQueryAlertParams, SearchType } from '../types'; +import type { EsQueryAlertMetaData, EsQueryAlertParams, SearchType } from '../types'; import { SearchSourceExpression, SearchSourceExpressionProps } from './search_source_expression'; import { EsQueryExpression } from './es_query_expression'; import { QueryFormTypeChooser } from './query_form_type_chooser'; @@ -33,12 +33,12 @@ const SearchSourceExpressionMemoized = memo( ); export const EsQueryAlertTypeExpression: React.FunctionComponent< - RuleTypeParamsExpressionProps + RuleTypeParamsExpressionProps > = (props) => { const { ruleParams, errors, setRuleProperty, setRuleParams } = props; const isSearchSource = isSearchSourceAlert(ruleParams); // metadata provided only when open alert from Discover page - const isManagementPage = !props.metadata; + const isManagementPage = props.metadata?.isManagementPage ?? true; const formTypeSelected = useCallback( (searchType: SearchType | null) => { diff --git a/x-pack/plugins/stack_alerts/public/alert_types/es_query/expression/search_source_expression.tsx b/x-pack/plugins/stack_alerts/public/alert_types/es_query/expression/search_source_expression.tsx index 52df5da4daea3..5074b9a4a97af 100644 --- a/x-pack/plugins/stack_alerts/public/alert_types/es_query/expression/search_source_expression.tsx +++ b/x-pack/plugins/stack_alerts/public/alert_types/es_query/expression/search_source_expression.tsx @@ -11,13 +11,14 @@ import { EuiSpacer, EuiLoadingSpinner, EuiEmptyPrompt, EuiCallOut } from '@elast import { ISearchSource } from '@kbn/data-plugin/common'; import { RuleTypeParamsExpressionProps } from '@kbn/triggers-actions-ui-plugin/public'; import { SavedQuery } from '@kbn/data-plugin/public'; -import { EsQueryAlertParams, SearchType } from '../types'; +import { EsQueryAlertMetaData, EsQueryAlertParams, SearchType } from '../types'; import { SearchSourceExpressionForm } from './search_source_expression_form'; import { DEFAULT_VALUES } from '../constants'; import { useTriggerUiActionServices } from '../util'; export type SearchSourceExpressionProps = RuleTypeParamsExpressionProps< - EsQueryAlertParams + EsQueryAlertParams, + EsQueryAlertMetaData >; export const SearchSourceExpression = ({ diff --git a/x-pack/plugins/stack_alerts/public/alert_types/es_query/expression/search_source_expression_form.tsx b/x-pack/plugins/stack_alerts/public/alert_types/es_query/expression/search_source_expression_form.tsx index 82ddfa671e3af..8d970442fee20 100644 --- a/x-pack/plugins/stack_alerts/public/alert_types/es_query/expression/search_source_expression_form.tsx +++ b/x-pack/plugins/stack_alerts/public/alert_types/es_query/expression/search_source_expression_form.tsx @@ -21,7 +21,7 @@ import { type ISearchSource, } from '@kbn/data-plugin/public'; import { STACK_ALERTS_FEATURE_ID } from '../../../../common'; -import { CommonAlertParams, EsQueryAlertParams, SearchType } from '../types'; +import { CommonAlertParams, EsQueryAlertMetaData, EsQueryAlertParams, SearchType } from '../types'; import { DEFAULT_VALUES } from '../constants'; import { DataViewSelectPopover } from '../../components/data_view_select_popover'; import { RuleCommonExpressions } from '../rule_common_expressions'; @@ -71,10 +71,10 @@ interface SearchSourceExpressionFormProps { searchSource: ISearchSource; ruleParams: EsQueryAlertParams; errors: IErrorObject; - metadata?: Record; + metadata?: EsQueryAlertMetaData; initialSavedQuery?: SavedQuery; setParam: (paramField: string, paramValue: unknown) => void; - onChangeMetaData: (metadata: Record) => void; + onChangeMetaData: (metadata: EsQueryAlertMetaData) => void; } const isSearchSourceParam = (action: LocalStateAction): action is SearchSourceParamsAction => { diff --git a/x-pack/plugins/stack_alerts/public/alert_types/es_query/types.ts b/x-pack/plugins/stack_alerts/public/alert_types/es_query/types.ts index 17c96dd3830b2..023d90a097da7 100644 --- a/x-pack/plugins/stack_alerts/public/alert_types/es_query/types.ts +++ b/x-pack/plugins/stack_alerts/public/alert_types/es_query/types.ts @@ -13,6 +13,7 @@ import type { DataViewEditorStart } from '@kbn/data-view-editor-plugin/public'; import type { UnifiedSearchPublicPluginStart } from '@kbn/unified-search-plugin/public'; import type { DataViewsPublicPluginStart } from '@kbn/data-views-plugin/public'; import { EXPRESSION_ERRORS } from './constants'; +import type { DataViewSelectPopoverMetaData } from '../components/data_view_select_popover'; export interface Comparator { text: string; @@ -34,6 +35,10 @@ export interface CommonAlertParams extends RuleTypeParams { excludeHitsFromPreviousRun: boolean; } +export interface EsQueryAlertMetaData extends DataViewSelectPopoverMetaData { + isManagementPage?: boolean; +} + export type EsQueryAlertParams = T extends SearchType.searchSource ? CommonAlertParams & OnlySearchSourceAlertParams : CommonAlertParams & OnlyEsQueryAlertParams; From c15a18a9f7443512c3cc835b28b25c910aac9a5a Mon Sep 17 00:00:00 2001 From: Davis McPhee Date: Mon, 31 Oct 2022 18:15:37 -0300 Subject: [PATCH 2/2] [Discover] Fix broken unit test --- .../es_query/expression/expression.test.tsx | 18 +++++++++++++----- 1 file changed, 13 insertions(+), 5 deletions(-) diff --git a/x-pack/plugins/stack_alerts/public/alert_types/es_query/expression/expression.test.tsx b/x-pack/plugins/stack_alerts/public/alert_types/es_query/expression/expression.test.tsx index c00bc0f1813a7..6bd33f56ecb12 100644 --- a/x-pack/plugins/stack_alerts/public/alert_types/es_query/expression/expression.test.tsx +++ b/x-pack/plugins/stack_alerts/public/alert_types/es_query/expression/expression.test.tsx @@ -13,7 +13,12 @@ import { httpServiceMock } from '@kbn/core/public/mocks'; import { dataPluginMock } from '@kbn/data-plugin/public/mocks'; import { dataViewPluginMocks } from '@kbn/data-views-plugin/public/mocks'; import { unifiedSearchPluginMock } from '@kbn/unified-search-plugin/public/mocks'; -import { CommonAlertParams, EsQueryAlertParams, SearchType } from '../types'; +import { + CommonAlertParams, + type EsQueryAlertMetaData, + EsQueryAlertParams, + SearchType, +} from '../types'; import { EsQueryAlertTypeExpression } from './expression'; import { chartPluginMock } from '@kbn/charts-plugin/public/mocks'; import { Subject } from 'rxjs'; @@ -144,7 +149,7 @@ dataMock.query.savedQueries.findSavedQueries = jest.fn(() => const Wrapper: React.FC<{ ruleParams: EsQueryAlertParams | EsQueryAlertParams; - metadata?: Record; + metadata?: EsQueryAlertMetaData; }> = ({ ruleParams, metadata }) => { const [currentRuleParams, setCurrentRuleParams] = useState(ruleParams); const errors = { @@ -186,7 +191,7 @@ const Wrapper: React.FC<{ const setup = ( ruleParams: EsQueryAlertParams | EsQueryAlertParams, - metadata?: Record + metadata?: EsQueryAlertMetaData ) => { return mountWithIntl( { test('should render QueryDSL view without the form type chooser', async () => { let wrapper: ReactWrapper; await act(async () => { - wrapper = setup(defaultEsQueryRuleParams, {}); + wrapper = setup(defaultEsQueryRuleParams, { adHocDataViewList: [], isManagementPage: false }); wrapper = await wrapper.update(); }); expect(findTestSubject(wrapper!, 'queryFormTypeChooserTitle').exists()).toBeFalsy(); @@ -264,7 +269,10 @@ describe('EsQueryAlertTypeExpression', () => { test('should render KQL and Lucene view without the form type chooser', async () => { let wrapper: ReactWrapper; await act(async () => { - wrapper = setup(defaultSearchSourceRuleParams, { adHocDataViewList: [] }); + wrapper = setup(defaultSearchSourceRuleParams, { + adHocDataViewList: [], + isManagementPage: false, + }); wrapper = await wrapper.update(); }); wrapper = await wrapper!.update();