From 31682bd3ff57ef0bf7536a6920684e9ab6261134 Mon Sep 17 00:00:00 2001 From: Christos Nasikas Date: Thu, 28 Jul 2022 16:42:39 +0300 Subject: [PATCH] [Cases] Add alerts experimental flag (#137215) * Setting for experimetnal badge in the alerts table * Fix types --- x-pack/plugins/cases/common/constants.ts | 2 +- x-pack/plugins/cases/common/ui/types.ts | 2 +- ..._cases_add_to_existing_case_modal.test.tsx | 2 +- .../case_view/case_view_page.test.tsx | 28 +++++++++++++++---- .../components/case_view/case_view_page.tsx | 18 +++++++----- .../connectors/resilient/__mocks__/api.ts | 4 +-- .../use_cases_add_to_new_case_flyout.test.tsx | 2 +- .../public/pages/cases/cases.tsx | 2 +- .../public/cases/pages/index.tsx | 1 + 9 files changed, 41 insertions(+), 20 deletions(-) diff --git a/x-pack/plugins/cases/common/constants.ts b/x-pack/plugins/cases/common/constants.ts index d3e957593ac8a..f9de7753a7d33 100644 --- a/x-pack/plugins/cases/common/constants.ts +++ b/x-pack/plugins/cases/common/constants.ts @@ -131,7 +131,7 @@ export const MAX_TITLE_LENGTH = 64 as const; */ export const DEFAULT_FEATURES: CasesFeaturesAllRequired = Object.freeze({ - alerts: { sync: true, enabled: true }, + alerts: { sync: true, enabled: true, isExperimental: false }, metrics: [], }); diff --git a/x-pack/plugins/cases/common/ui/types.ts b/x-pack/plugins/cases/common/ui/types.ts index d3f4e19d3ec10..9fef8ae47b3b0 100644 --- a/x-pack/plugins/cases/common/ui/types.ts +++ b/x-pack/plugins/cases/common/ui/types.ts @@ -36,7 +36,7 @@ import { SnakeToCamelCase } from '../types'; type DeepRequired = { [K in keyof T]: DeepRequired } & Required; export interface CasesContextFeatures { - alerts: { sync?: boolean; enabled?: boolean }; + alerts: { sync?: boolean; enabled?: boolean; isExperimental?: boolean }; metrics: SingleCaseMetricsFeature[]; } diff --git a/x-pack/plugins/cases/public/components/all_cases/selector_modal/use_cases_add_to_existing_case_modal.test.tsx b/x-pack/plugins/cases/public/components/all_cases/selector_modal/use_cases_add_to_existing_case_modal.test.tsx index b95b2fba0f14f..5dacedf15abc7 100644 --- a/x-pack/plugins/cases/public/components/all_cases/selector_modal/use_cases_add_to_existing_case_modal.test.tsx +++ b/x-pack/plugins/cases/public/components/all_cases/selector_modal/use_cases_add_to_existing_case_modal.test.tsx @@ -69,7 +69,7 @@ describe('use cases add to existing case modal hook', () => { appTitle: 'jest', basePath: '/jest', dispatch, - features: { alerts: { sync: true, enabled: true }, metrics: [] }, + features: { alerts: { sync: true, enabled: true, isExperimental: false }, metrics: [] }, releasePhase: 'ga', }} > diff --git a/x-pack/plugins/cases/public/components/case_view/case_view_page.test.tsx b/x-pack/plugins/cases/public/components/case_view/case_view_page.test.tsx index a3b6466136b03..ac73444800dea 100644 --- a/x-pack/plugins/cases/public/components/case_view/case_view_page.test.tsx +++ b/x-pack/plugins/cases/public/components/case_view/case_view_page.test.tsx @@ -5,8 +5,7 @@ * 2.0. */ -import { waitFor, within } from '@testing-library/dom'; -import { act } from '@testing-library/react-hooks'; +import { act, waitFor, within } from '@testing-library/react'; import userEvent from '@testing-library/user-event'; import React from 'react'; import { ConnectorTypes } from '../../../common/api'; @@ -43,6 +42,7 @@ jest.mock('../../containers/use_post_push_to_service'); jest.mock('../user_actions/timestamp'); jest.mock('../../common/navigation/hooks'); jest.mock('../../common/hooks'); +jest.mock('../connectors/resilient/api'); const useFetchCaseMock = useGetCase as jest.Mock; const useUrlParamsMock = useUrlParams as jest.Mock; @@ -435,8 +435,7 @@ describe('CaseViewPage', () => { }); }); - // unskip when alerts tab is activated - it.skip('navigates to the alerts tab when the alerts tab is clicked', async () => { + it('navigates to the alerts tab when the alerts tab is clicked', async () => { const navigateToCaseViewMock = useCaseViewNavigationMock().navigateToCaseView; const result = appMockRenderer.render(); userEvent.click(result.getByTestId('case-view-tab-title-alerts')); @@ -448,8 +447,7 @@ describe('CaseViewPage', () => { }); }); - // unskip when alerts tab is activated - it.skip('should display the alerts tab when the feature is enabled', async () => { + it('should display the alerts tab when the feature is enabled', async () => { appMockRenderer = createAppMockRenderer({ features: { alerts: { enabled: true } } }); const result = appMockRenderer.render(); await act(async () => { @@ -466,5 +464,23 @@ describe('CaseViewPage', () => { expect(result.queryByTestId('case-view-tab-title-alerts')).toBeFalsy(); }); }); + + it('should not show the experimental badge on the alerts table', async () => { + appMockRenderer = createAppMockRenderer({ features: { alerts: { isExperimental: false } } }); + const result = appMockRenderer.render(); + + await act(async () => { + expect(result.queryByTestId('case-view-alerts-table-experimental-badge')).toBeFalsy(); + }); + }); + + it('should show the experimental badge on the alerts table', async () => { + appMockRenderer = createAppMockRenderer({ features: { alerts: { isExperimental: true } } }); + const result = appMockRenderer.render(); + + await act(async () => { + expect(result.queryByTestId('case-view-alerts-table-experimental-badge')).toBeTruthy(); + }); + }); }); }); diff --git a/x-pack/plugins/cases/public/components/case_view/case_view_page.tsx b/x-pack/plugins/cases/public/components/case_view/case_view_page.tsx index df4a6aad4523f..0075fb985f113 100644 --- a/x-pack/plugins/cases/public/components/case_view/case_view_page.tsx +++ b/x-pack/plugins/cases/public/components/case_view/case_view_page.tsx @@ -123,13 +123,16 @@ export const CaseViewPage = React.memo( name: ( <> {ALERTS_TAB} - + {features.alerts.isExperimental ? ( + + ) : null} ), content: , @@ -141,6 +144,7 @@ export const CaseViewPage = React.memo( actionsNavigation, caseData, features.alerts.enabled, + features.alerts.isExperimental, ruleDetailsNavigation, showAlertDetails, useFetchAlertData, diff --git a/x-pack/plugins/cases/public/components/connectors/resilient/__mocks__/api.ts b/x-pack/plugins/cases/public/components/connectors/resilient/__mocks__/api.ts index c27248288907d..350cf7ec47974 100644 --- a/x-pack/plugins/cases/public/components/connectors/resilient/__mocks__/api.ts +++ b/x-pack/plugins/cases/public/components/connectors/resilient/__mocks__/api.ts @@ -10,7 +10,7 @@ import { Props } from '../api'; import { ResilientIncidentTypes, ResilientSeverity } from '../types'; export const getIncidentTypes = async (props: Props): Promise<{ data: ResilientIncidentTypes }> => - Promise.resolve({ data: incidentTypes }); + Promise.resolve({ data: incidentTypes, actionId: '1' }); export const getSeverity = async (props: Props): Promise<{ data: ResilientSeverity }> => - Promise.resolve({ data: severity }); + Promise.resolve({ data: severity, actionId: '1' }); diff --git a/x-pack/plugins/cases/public/components/create/flyout/use_cases_add_to_new_case_flyout.test.tsx b/x-pack/plugins/cases/public/components/create/flyout/use_cases_add_to_new_case_flyout.test.tsx index b49349f9844fa..fdd485a0ba807 100644 --- a/x-pack/plugins/cases/public/components/create/flyout/use_cases_add_to_new_case_flyout.test.tsx +++ b/x-pack/plugins/cases/public/components/create/flyout/use_cases_add_to_new_case_flyout.test.tsx @@ -39,7 +39,7 @@ describe('use cases add to new case flyout hook', () => { appTitle: 'jest', basePath: '/jest', dispatch, - features: { alerts: { sync: true, enabled: true }, metrics: [] }, + features: { alerts: { sync: true, enabled: true, isExperimental: false }, metrics: [] }, releasePhase: 'ga', }} > diff --git a/x-pack/plugins/observability/public/pages/cases/cases.tsx b/x-pack/plugins/observability/public/pages/cases/cases.tsx index 28a9f90251f64..1dcc8275d2830 100644 --- a/x-pack/plugins/observability/public/pages/cases/cases.tsx +++ b/x-pack/plugins/observability/public/pages/cases/cases.tsx @@ -52,7 +52,7 @@ export const Cases = React.memo(({ permissions }) => { basePath: CASES_PATH, permissions, owner: [CASES_OWNER], - features: { alerts: { sync: false } }, + features: { alerts: { sync: false, isExperimental: false } }, useFetchAlertData, showAlertDetails: (alertId: string) => { setSelectedAlertId(alertId); diff --git a/x-pack/plugins/security_solution/public/cases/pages/index.tsx b/x-pack/plugins/security_solution/public/cases/pages/index.tsx index 155873beeee2d..e2b5ef81ebe21 100644 --- a/x-pack/plugins/security_solution/public/cases/pages/index.tsx +++ b/x-pack/plugins/security_solution/public/cases/pages/index.tsx @@ -100,6 +100,7 @@ const CaseContainerComponent: React.FC = () => { owner: [APP_ID], features: { metrics: ['alerts.count', 'alerts.users', 'alerts.hosts', 'connectors', 'lifespan'], + alerts: { isExperimental: true }, }, refreshRef, onComponentInitialized,