[Security Solution] add prevalence expanded section to expandable flyout

x-pack/plugins/security_solution/cypress/e2e/investigations/alerts/expandable_flyout/alert_details_left_panel_prevalence_tab.cy.ts

@@ -5,24 +5,33 @@
  * 2.0.
  */
 
-import { createRule } from '../../../../tasks/api_calls/rules';
-import { getNewRule } from '../../../../objects/rule';
-import { DOCUMENT_DETAILS_FLYOUT_INSIGHTS_TAB_PREVALENCE_BUTTON } from '../../../../screens/expandable_flyout/alert_details_left_panel_prevalence_tab';
-import {
-  DOCUMENT_DETAILS_FLYOUT_INSIGHTS_TAB,
-  DOCUMENT_DETAILS_FLYOUT_INSIGHTS_TAB_BUTTON_GROUP,
-} from '../../../../screens/expandable_flyout/alert_details_left_panel';
 import { openPrevalenceTab } from '../../../../tasks/expandable_flyout/alert_details_left_panel_prevalence_tab';
 import { openInsightsTab } from '../../../../tasks/expandable_flyout/alert_details_left_panel';
 import { expandDocumentDetailsExpandableFlyoutLeftSection } from '../../../../tasks/expandable_flyout/alert_details_right_panel';
 import { expandFirstAlertExpandableFlyout } from '../../../../tasks/expandable_flyout/common';
+import {
+  DOCUMENT_DETAILS_FLYOUT_INSIGHTS_TAB,
+  DOCUMENT_DETAILS_FLYOUT_INSIGHTS_TAB_BUTTON_GROUP,
+} from '../../../../screens/expandable_flyout/alert_details_left_panel';
+import {
+  DOCUMENT_DETAILS_FLYOUT_INSIGHTS_TAB_PREVALENCE_TABLE_ALERT_COUNT_CELL,
+  DOCUMENT_DETAILS_FLYOUT_INSIGHTS_TAB_PREVALENCE_BUTTON,
+  DOCUMENT_DETAILS_FLYOUT_INSIGHTS_TAB_PREVALENCE_TABLE_NAME_CELL,
+  DOCUMENT_DETAILS_FLYOUT_INSIGHTS_TAB_PREVALENCE_TABLE_TYPE_CELL,
+  DOCUMENT_DETAILS_FLYOUT_INSIGHTS_TAB_PREVALENCE_TABLE_DOC_COUNT_CELL,
+  DOCUMENT_DETAILS_FLYOUT_INSIGHTS_TAB_PREVALENCE_TABLE_HOST_PREVALENCE_CELL,
+  DOCUMENT_DETAILS_FLYOUT_INSIGHTS_TAB_PREVALENCE_TABLE_USER_PREVALENCE_CELL,
+  DOCUMENT_DETAILS_FLYOUT_INSIGHTS_TAB_PREVALENCE_TABLE,
+} from '../../../../screens/expandable_flyout/alert_details_left_panel_prevalence_tab';
 import { cleanKibana } from '../../../../tasks/common';
-import { waitForAlertsToPopulate } from '../../../../tasks/create_new_rule';
 import { login, visit } from '../../../../tasks/login';
+import { createRule } from '../../../../tasks/api_calls/rules';
+import { getNewRule } from '../../../../objects/rule';
 import { ALERTS_URL } from '../../../../urls/navigation';
+import { waitForAlertsToPopulate } from '../../../../tasks/create_new_rule';
 
 describe(
-  'Expandable flyout left panel prevalence',
+  'Alert details expandable flyout left panel prevalence',
   { env: { ftrConfig: { enableExperimental: ['securityFlyoutEnabled'] } } },
   () => {
     beforeEach(() => {
@@ -37,7 +46,7 @@ describe(
       openPrevalenceTab();
     });
 
-    it('should show prevalence table', () => {
+    it('should display prevalence tab', () => {
       cy.get(DOCUMENT_DETAILS_FLYOUT_INSIGHTS_TAB)
         .should('be.visible')
         .and('have.text', 'Insights');
@@ -48,7 +57,29 @@ describe(
         .should('be.visible')
         .and('have.text', 'Prevalence');
 
-      // TODO actual test
+      cy.get(DOCUMENT_DETAILS_FLYOUT_INSIGHTS_TAB_PREVALENCE_TABLE).should('be.visible');
+      cy.get(DOCUMENT_DETAILS_FLYOUT_INSIGHTS_TAB_PREVALENCE_TABLE_TYPE_CELL)
+        .should('contain.text', 'host.name')
+        .and('contain.text', 'user.name');
+      cy.get(DOCUMENT_DETAILS_FLYOUT_INSIGHTS_TAB_PREVALENCE_TABLE_NAME_CELL)
+        .should('contain.text', 'siem-kibana')
+        .and('contain.text', 'test');
+      cy.get(DOCUMENT_DETAILS_FLYOUT_INSIGHTS_TAB_PREVALENCE_TABLE_ALERT_COUNT_CELL).should(
+        'contain.text',
+        2
+      );
+      cy.get(DOCUMENT_DETAILS_FLYOUT_INSIGHTS_TAB_PREVALENCE_TABLE_DOC_COUNT_CELL).should(
+        'contain.text',
+        2
+      );
+      cy.get(DOCUMENT_DETAILS_FLYOUT_INSIGHTS_TAB_PREVALENCE_TABLE_HOST_PREVALENCE_CELL).should(
+        'contain.text',
+        100
+      );
+      cy.get(DOCUMENT_DETAILS_FLYOUT_INSIGHTS_TAB_PREVALENCE_TABLE_USER_PREVALENCE_CELL).should(
+        'contain.text',
+        100
+      );
     });
   }
 );

x-pack/plugins/security_solution/cypress/screens/expandable_flyout/alert_details_left_panel_prevalence_tab.ts

@@ -5,9 +5,33 @@
  * 2.0.
  */
 
+import {
+  PREVALENCE_DETAILS_TABLE_ALERT_COUNT_CELL_TEST_ID,
+  PREVALENCE_DETAILS_TABLE_DOC_COUNT_CELL_TEST_ID,
+  PREVALENCE_DETAILS_TABLE_HOST_PREVALENCE_CELL_TEST_ID,
+  PREVALENCE_DETAILS_TABLE_NAME_CELL_TEST_ID,
+  PREVALENCE_DETAILS_TABLE_TEST_ID,
+  PREVALENCE_DETAILS_TABLE_TYPE_CELL_TEST_ID,
+  PREVALENCE_DETAILS_TABLE_USER_PREVALENCE_CELL_TEST_ID,
+} from '../../../public/flyout/left/components/test_ids';
 import { getDataTestSubjectSelector } from '../../helpers/common';
 import { INSIGHTS_TAB_PREVALENCE_BUTTON_TEST_ID } from '../../../public/flyout/left/tabs/test_ids';
 
 export const DOCUMENT_DETAILS_FLYOUT_INSIGHTS_TAB_PREVALENCE_BUTTON = getDataTestSubjectSelector(
   INSIGHTS_TAB_PREVALENCE_BUTTON_TEST_ID
 );
+export const DOCUMENT_DETAILS_FLYOUT_INSIGHTS_TAB_PREVALENCE_TABLE = getDataTestSubjectSelector(
+  PREVALENCE_DETAILS_TABLE_TEST_ID
+);
+export const DOCUMENT_DETAILS_FLYOUT_INSIGHTS_TAB_PREVALENCE_TABLE_TYPE_CELL =
+  getDataTestSubjectSelector(PREVALENCE_DETAILS_TABLE_TYPE_CELL_TEST_ID);
+export const DOCUMENT_DETAILS_FLYOUT_INSIGHTS_TAB_PREVALENCE_TABLE_NAME_CELL =
+  getDataTestSubjectSelector(PREVALENCE_DETAILS_TABLE_NAME_CELL_TEST_ID);
+export const DOCUMENT_DETAILS_FLYOUT_INSIGHTS_TAB_PREVALENCE_TABLE_ALERT_COUNT_CELL =
+  getDataTestSubjectSelector(PREVALENCE_DETAILS_TABLE_ALERT_COUNT_CELL_TEST_ID);
+export const DOCUMENT_DETAILS_FLYOUT_INSIGHTS_TAB_PREVALENCE_TABLE_DOC_COUNT_CELL =
+  getDataTestSubjectSelector(PREVALENCE_DETAILS_TABLE_DOC_COUNT_CELL_TEST_ID);
+export const DOCUMENT_DETAILS_FLYOUT_INSIGHTS_TAB_PREVALENCE_TABLE_HOST_PREVALENCE_CELL =
+  getDataTestSubjectSelector(PREVALENCE_DETAILS_TABLE_HOST_PREVALENCE_CELL_TEST_ID);
+export const DOCUMENT_DETAILS_FLYOUT_INSIGHTS_TAB_PREVALENCE_TABLE_USER_PREVALENCE_CELL =
+  getDataTestSubjectSelector(PREVALENCE_DETAILS_TABLE_USER_PREVALENCE_CELL_TEST_ID);

x-pack/plugins/security_solution/public/flyout/left/components/analyze_graph.test.tsx

@@ -8,8 +8,7 @@
 import React from 'react';
 import { render } from '@testing-library/react';
 import '@testing-library/jest-dom';
-import type { LeftPanelContext } from '../context';
-import { LeftFlyoutContext } from '../context';
+import { LeftPanelContext } from '../context';
 import { TestProviders } from '../../../common/mock';
 import { AnalyzeGraph } from './analyze_graph';
 import { ANALYZE_GRAPH_ERROR_TEST_ID, ANALYZER_GRAPH_TEST_ID } from './test_ids';
@@ -39,9 +38,9 @@ describe('<AnalyzeGraph />', () => {
 
     const wrapper = render(
       <TestProviders>
-        <LeftFlyoutContext.Provider value={contextValue}>
+        <LeftPanelContext.Provider value={contextValue}>
           <AnalyzeGraph />
-        </LeftFlyoutContext.Provider>
+        </LeftPanelContext.Provider>
       </TestProviders>
     );
     expect(wrapper.getByTestId(ANALYZER_GRAPH_TEST_ID)).toBeInTheDocument();
@@ -54,9 +53,9 @@ describe('<AnalyzeGraph />', () => {
 
     const wrapper = render(
       <TestProviders>
-        <LeftFlyoutContext.Provider value={contextValue}>
+        <LeftPanelContext.Provider value={contextValue}>
           <AnalyzeGraph />
-        </LeftFlyoutContext.Provider>
+        </LeftPanelContext.Provider>
       </TestProviders>
     );
     expect(wrapper.getByTestId(ANALYZE_GRAPH_ERROR_TEST_ID)).toBeInTheDocument();

x-pack/plugins/security_solution/public/flyout/left/components/entities_details.test.tsx

@@ -8,7 +8,7 @@
 import React from 'react';
 import { render } from '@testing-library/react';
 import '@testing-library/jest-dom';
-import { LeftFlyoutContext } from '../context';
+import { LeftPanelContext } from '../context';
 import { TestProviders } from '../../../common/mock';
 import { EntitiesDetails } from './entities_details';
 import { ENTITIES_DETAILS_TEST_ID, HOST_DETAILS_TEST_ID, USER_DETAILS_TEST_ID } from './test_ids';
@@ -35,9 +35,9 @@ describe('<EntitiesDetails />', () => {
   it('renders entities details correctly', () => {
     const { getByTestId } = render(
       <TestProviders>
-        <LeftFlyoutContext.Provider value={mockContextValue}>
+        <LeftPanelContext.Provider value={mockContextValue}>
           <EntitiesDetails />
-        </LeftFlyoutContext.Provider>
+        </LeftPanelContext.Provider>
       </TestProviders>
     );
     expect(getByTestId(ENTITIES_DETAILS_TEST_ID)).toBeInTheDocument();
@@ -48,15 +48,15 @@ describe('<EntitiesDetails />', () => {
   it('does not render user and host details if user name and host name are not available', () => {
     const { queryByTestId } = render(
       <TestProviders>
-        <LeftFlyoutContext.Provider
+        <LeftPanelContext.Provider
           value={{
             ...mockContextValue,
             getFieldsData: (fieldName) =>
               fieldName === '@timestamp' ? ['2022-07-25T08:20:18.966Z'] : [],
           }}
         >
           <EntitiesDetails />
-        </LeftFlyoutContext.Provider>
+        </LeftPanelContext.Provider>
       </TestProviders>
     );
     expect(queryByTestId(USER_DETAILS_TEST_ID)).not.toBeInTheDocument();
@@ -66,7 +66,7 @@ describe('<EntitiesDetails />', () => {
   it('does not render user and host details if @timestamp is not available', () => {
     const { queryByTestId } = render(
       <TestProviders>
-        <LeftFlyoutContext.Provider
+        <LeftPanelContext.Provider
           value={{
             ...mockContextValue,
             getFieldsData: (fieldName) => {
@@ -82,7 +82,7 @@ describe('<EntitiesDetails />', () => {
           }}
         >
           <EntitiesDetails />
-        </LeftFlyoutContext.Provider>
+        </LeftPanelContext.Provider>
       </TestProviders>
     );
     expect(queryByTestId(USER_DETAILS_TEST_ID)).not.toBeInTheDocument();

x-pack/plugins/security_solution/public/flyout/left/components/prevalence_details.test.tsx

@@ -0,0 +1,82 @@
+/*
+ * 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 { render } from '@testing-library/react';
+import React from 'react';
+import { getSummaryRows } from '../../../common/components/event_details/get_alert_summary_rows';
+import { LeftPanelContext } from '../context';
+import { PrevalenceDetails } from './prevalence_details';
+import {
+  PREVALENCE_DETAILS_TABLE_ERROR_TEST_ID,
+  PREVALENCE_DETAILS_TABLE_TEST_ID,
+} from './test_ids';
+import { useFetchFieldValuePairByEventType } from '../../shared/hooks/use_fetch_field_value_pair_by_event_type';
+import { useFetchFieldValuePairWithAggregation } from '../../shared/hooks/use_fetch_field_value_pair_with_aggregation';
+import { useFetchUniqueByField } from '../../shared/hooks/use_fetch_unique_by_field';
+
+jest.mock('../../../common/components/event_details/get_alert_summary_rows');
+jest.mock('../../shared/hooks/use_fetch_field_value_pair_by_event_type');
+jest.mock('../../shared/hooks/use_fetch_field_value_pair_with_aggregation');
+jest.mock('../../shared/hooks/use_fetch_unique_by_field');
+
+const panelContextValue = {
+  eventId: 'event id',
+  indexName: 'indexName',
+  browserFields: {},
+  dataFormattedForFieldBrowser: [],
+} as unknown as LeftPanelContext;
+
+describe('PrevalenceDetails', () => {
+  jest.mocked(useFetchFieldValuePairByEventType).mockReturnValue({
+    loading: false,
+    error: false,
+    count: 1,
+  });
+  jest.mocked(useFetchFieldValuePairWithAggregation).mockReturnValue({
+    loading: false,
+    error: false,
+    count: 1,
+  });
+  jest.mocked(useFetchUniqueByField).mockReturnValue({
+    loading: false,
+    error: false,
+    count: 1,
+  });
+
+  it('should render the table', () => {
+    const mockSummaryRow = {
+      title: 'test',
+      description: {
+        data: {
+          field: 'field',
+        },
+        values: ['value'],
+      },
+    };
+    (getSummaryRows as jest.Mock).mockReturnValue([mockSummaryRow]);
+
+    const { getByTestId } = render(
+      <LeftPanelContext.Provider value={panelContextValue}>
+        <PrevalenceDetails />
+      </LeftPanelContext.Provider>
+    );
+
+    expect(getByTestId(PREVALENCE_DETAILS_TABLE_TEST_ID)).toBeInTheDocument();
+  });
+
+  it('should render the error message if no highlighted fields', () => {
+    jest.mocked(getSummaryRows).mockReturnValue([]);
+
+    const { getByTestId } = render(
+      <LeftPanelContext.Provider value={panelContextValue}>
+        <PrevalenceDetails />
+      </LeftPanelContext.Provider>
+    );
+
+    expect(getByTestId(PREVALENCE_DETAILS_TABLE_ERROR_TEST_ID)).toBeInTheDocument();
+  });
+});