diff --git a/x-pack/plugins/security_solution/cypress/e2e/detection_alerts/expandable_flyout/alert_details_left_panel.cy.ts b/x-pack/plugins/security_solution/cypress/e2e/detection_alerts/expandable_flyout/alert_details_left_panel.cy.ts
index 63a3527986b01..e2427dc9c7218 100644
--- a/x-pack/plugins/security_solution/cypress/e2e/detection_alerts/expandable_flyout/alert_details_left_panel.cy.ts
+++ b/x-pack/plugins/security_solution/cypress/e2e/detection_alerts/expandable_flyout/alert_details_left_panel.cy.ts
@@ -92,8 +92,6 @@ describe.skip('Alert details expandable flyout left panel', { testIsolation: fal
       .and('have.text', 'Session view');
 
     openGraphAnalyzer();
-    cy.get(DOCUMENT_DETAILS_FLYOUT_VISUALIZE_TAB_GRAPH_ANALYZER_CONTENT)
-      .should('be.visible')
-      .and('have.text', 'Analyzer graph');
+    cy.get(DOCUMENT_DETAILS_FLYOUT_VISUALIZE_TAB_GRAPH_ANALYZER_CONTENT).should('be.visible');
   });
 });
diff --git a/x-pack/plugins/security_solution/cypress/e2e/detection_alerts/expandable_flyout/alert_details_right_panel_overview_tab.cy.ts b/x-pack/plugins/security_solution/cypress/e2e/detection_alerts/expandable_flyout/alert_details_right_panel_overview_tab.cy.ts
index 06242709b52cc..30d25d16c93a8 100644
--- a/x-pack/plugins/security_solution/cypress/e2e/detection_alerts/expandable_flyout/alert_details_right_panel_overview_tab.cy.ts
+++ b/x-pack/plugins/security_solution/cypress/e2e/detection_alerts/expandable_flyout/alert_details_right_panel_overview_tab.cy.ts
@@ -12,9 +12,9 @@ import {
   DOCUMENT_DETAILS_FLYOUT_OVERVIEW_TAB_HIGHLIGHTED_FIELDS_GO_TO_TABLE_LINK,
   DOCUMENT_DETAILS_FLYOUT_TABLE_TAB_CONTENT,
   DOCUMENT_DETAILS_FLYOUT_TABLE_TAB_EVENT_TYPE_ROW,
-  DOCUMENT_DETAILS_FLYOUT_OVERVIEW_TAB_HIGHLIGHTED_FIELDS,
-  DOCUMENT_DETAILS_FLYOUT_OVERVIEW_TAB_HIGHLIGHTED_FIELDS_HEADER_EXPAND_ICON,
   DOCUMENT_DETAILS_FLYOUT_OVERVIEW_TAB_HIGHLIGHTED_FIELDS_HEADER_TITLE,
+  DOCUMENT_DETAILS_FLYOUT_OVERVIEW_TAB_INVESTIGATION_SECTION_HEADER,
+  DOCUMENT_DETAILS_FLYOUT_OVERVIEW_TAB_INVESTIGATION_SECTION_CONTENT,
   DOCUMENT_DETAILS_FLYOUT_OVERVIEW_TAB_DESCRIPTION_SECTION_HEADER,
   DOCUMENT_DETAILS_FLYOUT_OVERVIEW_TAB_DESCRIPTION_SECTION_CONTENT,
   DOCUMENT_DETAILS_FLYOUT_OVERVIEW_TAB_REASON_TITLE,
@@ -27,6 +27,7 @@ import {
   expandFirstAlertExpandableFlyout,
   openOverviewTab,
   toggleOverviewTabDescriptionSection,
+  toggleOverviewTabInvestigationSection,
 } from '../../../tasks/document_expandable_flyout';
 import { cleanKibana } from '../../../tasks/common';
 import { login, visit } from '../../../tasks/login';
@@ -89,11 +90,6 @@ describe.skip(
           .and('contain.text', rule.name);
       });
 
-      it('should display mitre attack', () => {
-        cy.get(DOCUMENT_DETAILS_FLYOUT_OVERVIEW_TAB_MITRE_ATTACK_TITLE).should('be.visible');
-        cy.get(DOCUMENT_DETAILS_FLYOUT_OVERVIEW_TAB_MITRE_ATTACK_DETAILS).should('be.visible');
-      });
-
       it('should display mitre attack', () => {
         cy.get(DOCUMENT_DETAILS_FLYOUT_OVERVIEW_TAB_MITRE_ATTACK_TITLE)
           .should('be.visible')
@@ -112,45 +108,40 @@ describe.skip(
     describe('investigation section', () => {
       before(() => {
         toggleOverviewTabDescriptionSection();
+        toggleOverviewTabInvestigationSection();
       });
 
-      it('should display highlighted fields', () => {
-        cy.get(DOCUMENT_DETAILS_FLYOUT_OVERVIEW_TAB_HIGHLIGHTED_FIELDS)
-          .scrollIntoView()
-          .within(() => {
-            cy.get(DOCUMENT_DETAILS_FLYOUT_OVERVIEW_TAB_HIGHLIGHTED_FIELDS_HEADER_EXPAND_ICON)
-              .should('be.visible')
-              .click();
-            cy.get(DOCUMENT_DETAILS_FLYOUT_OVERVIEW_TAB_HIGHLIGHTED_FIELDS_HEADER_TITLE)
-              .should('be.visible')
-              .and('have.text', 'Highlighted fields');
-            cy.get(DOCUMENT_DETAILS_FLYOUT_OVERVIEW_TAB_HIGHLIGHTED_FIELDS_DETAILS).should(
-              'be.visible'
-            );
+      it('should display description section header and content', () => {
+        cy.get(DOCUMENT_DETAILS_FLYOUT_OVERVIEW_TAB_INVESTIGATION_SECTION_HEADER)
+          .should('be.visible')
+          .and('have.text', 'Investigation');
+        cy.get(DOCUMENT_DETAILS_FLYOUT_OVERVIEW_TAB_INVESTIGATION_SECTION_CONTENT).should(
+          'be.visible'
+        );
+      });
 
-            // close highlighted fields to reset the view for next test
-            cy.get(DOCUMENT_DETAILS_FLYOUT_OVERVIEW_TAB_HIGHLIGHTED_FIELDS_HEADER_EXPAND_ICON)
-              .should('be.visible')
-              .click();
-          });
+      it('should display highlighted fields', () => {
+        cy.get(DOCUMENT_DETAILS_FLYOUT_OVERVIEW_TAB_HIGHLIGHTED_FIELDS_HEADER_TITLE)
+          .should('be.visible')
+          .and('have.text', 'Highlighted fields');
+        cy.get(DOCUMENT_DETAILS_FLYOUT_OVERVIEW_TAB_HIGHLIGHTED_FIELDS_DETAILS).should(
+          'be.visible'
+        );
       });
+
       it('should navigate to table tab when clicking on highlighted fields view button', () => {
-        cy.get(DOCUMENT_DETAILS_FLYOUT_OVERVIEW_TAB_HIGHLIGHTED_FIELDS)
-          .scrollIntoView()
-          .within(() => {
-            cy.get(DOCUMENT_DETAILS_FLYOUT_OVERVIEW_TAB_HIGHLIGHTED_FIELDS_HEADER_EXPAND_ICON)
-              .should('be.visible')
-              .click();
-            cy.get(DOCUMENT_DETAILS_FLYOUT_OVERVIEW_TAB_HIGHLIGHTED_FIELDS_GO_TO_TABLE_LINK)
-              .should('be.visible')
-              .click();
-          });
+        cy.get(DOCUMENT_DETAILS_FLYOUT_OVERVIEW_TAB_HIGHLIGHTED_FIELDS_GO_TO_TABLE_LINK)
+          .should('be.visible')
+          .click();
 
         // the table component is rendered within a dom element with overflow, so Cypress isn't finding it
         // this next line is a hack that scrolls to a specific element in the table
         // (in the middle of it vertically) to ensure Cypress finds it
         cy.get(DOCUMENT_DETAILS_FLYOUT_TABLE_TAB_EVENT_TYPE_ROW).scrollIntoView();
         cy.get(DOCUMENT_DETAILS_FLYOUT_TABLE_TAB_CONTENT).should('be.visible');
+
+        // go back to Overview tab to reset view for next test
+        openOverviewTab();
       });
     });
   }
diff --git a/x-pack/plugins/security_solution/cypress/screens/document_expandable_flyout.ts b/x-pack/plugins/security_solution/cypress/screens/document_expandable_flyout.ts
index 6c567e109bb40..145ef81e44c4a 100644
--- a/x-pack/plugins/security_solution/cypress/screens/document_expandable_flyout.ts
+++ b/x-pack/plugins/security_solution/cypress/screens/document_expandable_flyout.ts
@@ -49,8 +49,10 @@ import {
   HIGHLIGHTED_FIELDS_DETAILS_TEST_ID,
   HIGHLIGHTED_FIELDS_GO_TO_TABLE_LINK,
   HIGHLIGHTED_FIELDS_HEADER_EXPAND_ICON_TEST_ID,
-  HIGHLIGHTED_FIELDS_HEADER_TITLE_TEST_ID,
   HIGHLIGHTED_FIELDS_TEST_ID,
+  HIGHLIGHTED_FIELDS_TITLE_TEST_ID,
+  INVESTIGATION_SECTION_CONTENT_TEST_ID,
+  INVESTIGATION_SECTION_HEADER_TEST_ID,
   MITRE_ATTACK_DETAILS_TEST_ID,
   MITRE_ATTACK_TITLE_TEST_ID,
   REASON_DETAILS_TEST_ID,
@@ -154,8 +156,13 @@ export const DOCUMENT_DETAILS_FLYOUT_OVERVIEW_TAB_HIGHLIGHTED_FIELDS = getDataTe
 );
 export const DOCUMENT_DETAILS_FLYOUT_OVERVIEW_TAB_HIGHLIGHTED_FIELDS_HEADER_EXPAND_ICON =
   getDataTestSubjectSelector(HIGHLIGHTED_FIELDS_HEADER_EXPAND_ICON_TEST_ID);
+export const DOCUMENT_DETAILS_FLYOUT_OVERVIEW_TAB_INVESTIGATION_SECTION_HEADER =
+  getDataTestSubjectSelector(INVESTIGATION_SECTION_HEADER_TEST_ID);
+export const DOCUMENT_DETAILS_FLYOUT_OVERVIEW_TAB_INVESTIGATION_SECTION_CONTENT =
+  getDataTestSubjectSelector(INVESTIGATION_SECTION_CONTENT_TEST_ID);
+
 export const DOCUMENT_DETAILS_FLYOUT_OVERVIEW_TAB_HIGHLIGHTED_FIELDS_HEADER_TITLE =
-  getDataTestSubjectSelector(HIGHLIGHTED_FIELDS_HEADER_TITLE_TEST_ID);
+  getDataTestSubjectSelector(HIGHLIGHTED_FIELDS_TITLE_TEST_ID);
 export const DOCUMENT_DETAILS_FLYOUT_OVERVIEW_TAB_HIGHLIGHTED_FIELDS_DETAILS =
   getDataTestSubjectSelector(HIGHLIGHTED_FIELDS_DETAILS_TEST_ID);
 export const DOCUMENT_DETAILS_FLYOUT_OVERVIEW_TAB_HIGHLIGHTED_FIELDS_GO_TO_TABLE_LINK =
diff --git a/x-pack/plugins/security_solution/cypress/tasks/document_expandable_flyout.ts b/x-pack/plugins/security_solution/cypress/tasks/document_expandable_flyout.ts
index 7c25557fea42a..a93c15d95435f 100644
--- a/x-pack/plugins/security_solution/cypress/tasks/document_expandable_flyout.ts
+++ b/x-pack/plugins/security_solution/cypress/tasks/document_expandable_flyout.ts
@@ -14,6 +14,7 @@ import {
   DOCUMENT_DETAILS_FLYOUT_INVESTIGATIONS_TAB,
   DOCUMENT_DETAILS_FLYOUT_JSON_TAB,
   DOCUMENT_DETAILS_FLYOUT_OVERVIEW_TAB,
+  DOCUMENT_DETAILS_FLYOUT_OVERVIEW_TAB_INVESTIGATION_SECTION_HEADER,
   DOCUMENT_DETAILS_FLYOUT_OVERVIEW_TAB_DESCRIPTION_SECTION_HEADER,
   DOCUMENT_DETAILS_FLYOUT_TABLE_TAB,
   DOCUMENT_DETAILS_FLYOUT_TABLE_TAB_CLEAR_FILTER,
@@ -59,7 +60,17 @@ export const scrollWithinDocumentDetailsExpandableFlyoutRightSection = (x: numbe
  * Open the Overview tab in the document details expandable flyout right section
  */
 export const openOverviewTab = () =>
-  cy.get(DOCUMENT_DETAILS_FLYOUT_OVERVIEW_TAB).should('be.visible').click();
+  cy.get(DOCUMENT_DETAILS_FLYOUT_OVERVIEW_TAB).scrollIntoView().should('be.visible').click();
+
+/**
+ * Toggle the Overview tab description section in the document details expandable flyout right section
+ */
+export const toggleOverviewTabInvestigationSection = () =>
+  cy
+    .get(DOCUMENT_DETAILS_FLYOUT_OVERVIEW_TAB_INVESTIGATION_SECTION_HEADER)
+    .scrollIntoView()
+    .should('be.visible')
+    .click();
 
 /**
  * Toggle the Overview tab description section in the document details expandable flyout right section
@@ -67,6 +78,7 @@ export const openOverviewTab = () =>
 export const toggleOverviewTabDescriptionSection = () =>
   cy
     .get(DOCUMENT_DETAILS_FLYOUT_OVERVIEW_TAB_DESCRIPTION_SECTION_HEADER)
+    .scrollIntoView()
     .should('be.visible')
     .click();
 
diff --git a/x-pack/plugins/security_solution/public/flyout/right/components/highlighted_fields.stories.tsx b/x-pack/plugins/security_solution/public/flyout/right/components/highlighted_fields.stories.tsx
index b0adfdfeb4d67..8b98a72cc90a4 100644
--- a/x-pack/plugins/security_solution/public/flyout/right/components/highlighted_fields.stories.tsx
+++ b/x-pack/plugins/security_solution/public/flyout/right/components/highlighted_fields.stories.tsx
@@ -19,27 +19,7 @@ export default {
 // TODO ideally we would want to have some data here, but we need to spent some time getting all the foundation items for storybook
 //  (ReduxStoreProvider, CellActionsProvider...) similarly to how it was done for the TestProvidersComponent
 //  see ticket https://github.com/elastic/security-team/issues/6223
-export const Expanded: Story<void> = () => {
-  const flyoutContextValue = {
-    openRightPanel: () => window.alert('openRightPanel called'),
-  } as unknown as ExpandableFlyoutContext;
-  const panelContextValue = {
-    eventId: 'eventId',
-    indexName: 'indexName',
-    dataFormattedForFieldBrowser: [],
-    browserFields: {},
-  } as unknown as RightPanelContext;
-
-  return (
-    <ExpandableFlyoutContext.Provider value={flyoutContextValue}>
-      <RightPanelContext.Provider value={panelContextValue}>
-        <HighlightedFields expanded={true} />
-      </RightPanelContext.Provider>
-    </ExpandableFlyoutContext.Provider>
-  );
-};
-
-export const Collapsed: Story<void> = () => {
+export const Default: Story<void> = () => {
   const flyoutContextValue = {
     openRightPanel: () => window.alert('openRightPanel called'),
   } as unknown as ExpandableFlyoutContext;
diff --git a/x-pack/plugins/security_solution/public/flyout/right/components/highlighted_fields.test.tsx b/x-pack/plugins/security_solution/public/flyout/right/components/highlighted_fields.test.tsx
index 4724b6f9a9c49..52a85b66a3108 100644
--- a/x-pack/plugins/security_solution/public/flyout/right/components/highlighted_fields.test.tsx
+++ b/x-pack/plugins/security_solution/public/flyout/right/components/highlighted_fields.test.tsx
@@ -8,75 +8,19 @@
 import React from 'react';
 import { render } from '@testing-library/react';
 import { RightPanelContext } from '../context';
-import {
-  HIGHLIGHTED_FIELDS_DETAILS_TEST_ID,
-  HIGHLIGHTED_FIELDS_GO_TO_TABLE_LINK,
-  HIGHLIGHTED_FIELDS_HEADER_EXPAND_ICON_TEST_ID,
-  HIGHLIGHTED_FIELDS_HEADER_TITLE_TEST_ID,
-} from './test_ids';
+import { HIGHLIGHTED_FIELDS_DETAILS_TEST_ID, HIGHLIGHTED_FIELDS_TITLE_TEST_ID } from './test_ids';
 import { ExpandableFlyoutContext } from '@kbn/expandable-flyout/src/context';
 import { HighlightedFields } from './highlighted_fields';
-import { RightPanelKey, RightPanelTableTabPath } from '..';
 import { getMockTheme } from '../../../common/lib/kibana/kibana_react.mock';
 import { ThemeProvider } from 'styled-components';
 
-const mockTheme = getMockTheme({
-  eui: {
-    euiSizeL: '10px',
-  },
-});
-
 describe('<HighlightedFields />', () => {
-  it('should render the component collapsed', () => {
-    const flyoutContextValue = {
-      openRightPanel: jest.fn(),
-    } as unknown as ExpandableFlyoutContext;
-    const panelContextValue = {
-      eventId: 'eventId',
-      indexName: 'indexName',
-      dataFormattedForFieldBrowser: [],
-      browserFields: {},
-    } as unknown as RightPanelContext;
-
-    const { getByTestId } = render(
-      <ThemeProvider theme={mockTheme}>
-        <ExpandableFlyoutContext.Provider value={flyoutContextValue}>
-          <RightPanelContext.Provider value={panelContextValue}>
-            <HighlightedFields />
-          </RightPanelContext.Provider>
-        </ExpandableFlyoutContext.Provider>
-      </ThemeProvider>
-    );
-
-    expect(getByTestId(HIGHLIGHTED_FIELDS_HEADER_TITLE_TEST_ID)).toBeInTheDocument();
-  });
-
-  it('should render the component expanded', () => {
-    const flyoutContextValue = {
-      openRightPanel: jest.fn(),
-    } as unknown as ExpandableFlyoutContext;
-    const panelContextValue = {
-      eventId: 'eventId',
-      indexName: 'indexName',
-      dataFormattedForFieldBrowser: [],
-      browserFields: {},
-    } as unknown as RightPanelContext;
-
-    const { getByTestId } = render(
-      <ThemeProvider theme={mockTheme}>
-        <ExpandableFlyoutContext.Provider value={flyoutContextValue}>
-          <RightPanelContext.Provider value={panelContextValue}>
-            <HighlightedFields expanded={true} />
-          </RightPanelContext.Provider>
-        </ExpandableFlyoutContext.Provider>
-      </ThemeProvider>
-    );
-
-    expect(getByTestId(HIGHLIGHTED_FIELDS_HEADER_TITLE_TEST_ID)).toBeInTheDocument();
-    expect(getByTestId(HIGHLIGHTED_FIELDS_DETAILS_TEST_ID)).toBeInTheDocument();
-  });
-
-  it('should expand details when clicking on header', () => {
+  it('should render the component', () => {
+    const mockTheme = getMockTheme({
+      eui: {
+        euiSizeL: '10px',
+      },
+    });
     const flyoutContextValue = {
       openRightPanel: jest.fn(),
     } as unknown as ExpandableFlyoutContext;
@@ -97,43 +41,10 @@ describe('<HighlightedFields />', () => {
       </ThemeProvider>
     );
 
-    getByTestId(HIGHLIGHTED_FIELDS_HEADER_EXPAND_ICON_TEST_ID).click();
+    expect(getByTestId(HIGHLIGHTED_FIELDS_TITLE_TEST_ID)).toBeInTheDocument();
     expect(getByTestId(HIGHLIGHTED_FIELDS_DETAILS_TEST_ID)).toBeInTheDocument();
   });
 
-  it('should navigate to table tab when clicking on the link button', () => {
-    const flyoutContextValue = {
-      openRightPanel: jest.fn(),
-    } as unknown as ExpandableFlyoutContext;
-    const panelContextValue = {
-      eventId: 'eventId',
-      indexName: 'indexName',
-      dataFormattedForFieldBrowser: [],
-      browserFields: {},
-    } as unknown as RightPanelContext;
-
-    const { getByTestId } = render(
-      <ThemeProvider theme={mockTheme}>
-        <ExpandableFlyoutContext.Provider value={flyoutContextValue}>
-          <RightPanelContext.Provider value={panelContextValue}>
-            <HighlightedFields />
-          </RightPanelContext.Provider>
-        </ExpandableFlyoutContext.Provider>
-      </ThemeProvider>
-    );
-
-    getByTestId(HIGHLIGHTED_FIELDS_HEADER_EXPAND_ICON_TEST_ID).click();
-    getByTestId(HIGHLIGHTED_FIELDS_GO_TO_TABLE_LINK).click();
-    expect(flyoutContextValue.openRightPanel).toHaveBeenCalledWith({
-      id: RightPanelKey,
-      path: RightPanelTableTabPath,
-      params: {
-        id: panelContextValue.eventId,
-        indexName: panelContextValue.indexName,
-      },
-    });
-  });
-
   it('should render empty component if dataFormattedForFieldBrowser is null', () => {
     const flyoutContextValue = {} as unknown as ExpandableFlyoutContext;
     const panelContextValue = {
diff --git a/x-pack/plugins/security_solution/public/flyout/right/components/highlighted_fields.tsx b/x-pack/plugins/security_solution/public/flyout/right/components/highlighted_fields.tsx
index f8f7ed46f505f..1c0ee677d9e80 100644
--- a/x-pack/plugins/security_solution/public/flyout/right/components/highlighted_fields.tsx
+++ b/x-pack/plugins/security_solution/public/flyout/right/components/highlighted_fields.tsx
@@ -5,27 +5,17 @@
  * 2.0.
  */
 
-import { EuiFlexGroup } from '@elastic/eui';
-import type { VFC } from 'react';
-import React, { useCallback, useState } from 'react';
+import type { FC } from 'react';
+import React, { useCallback } from 'react';
 import { useExpandableFlyoutContext } from '@kbn/expandable-flyout';
-import { HIGHLIGHTED_FIELDS_TEST_ID } from './test_ids';
+import { EuiFlexGroup, EuiFlexItem, EuiPanel, EuiTitle } from '@elastic/eui';
+import { HIGHLIGHTED_FIELDS_DETAILS_TEST_ID, HIGHLIGHTED_FIELDS_TITLE_TEST_ID } from './test_ids';
 import { AlertSummaryView } from '../../../common/components/event_details/alert_summary_view';
 import { HIGHLIGHTED_FIELDS_TITLE } from './translations';
-import { HeaderSection } from '../../../common/components/header_section';
 import { useRightPanelContext } from '../context';
 import { RightPanelKey, RightPanelTableTabPath } from '..';
 
-export interface HighlightedFieldsProps {
-  /**
-   * Boolean to allow the component to be expanded or collapsed on first render
-   */
-  expanded?: boolean;
-}
-
-export const HighlightedFields: VFC<HighlightedFieldsProps> = ({ expanded = false }) => {
-  const [isPanelExpanded, setIsPanelExpanded] = useState(expanded);
-
+export const HighlightedFields: FC = () => {
   const { openRightPanel } = useExpandableFlyoutContext();
   const { eventId, indexName, dataFormattedForFieldBrowser, browserFields } =
     useRightPanelContext();
@@ -46,28 +36,26 @@ export const HighlightedFields: VFC<HighlightedFieldsProps> = ({ expanded = fals
   }
 
   return (
-    <EuiFlexGroup gutterSize="none" direction="column" data-test-subj={HIGHLIGHTED_FIELDS_TEST_ID}>
-      <HeaderSection
-        alignHeader="center"
-        hideSubtitle
-        outerDirection="row"
-        title={HIGHLIGHTED_FIELDS_TITLE}
-        titleSize="xs"
-        toggleQuery={setIsPanelExpanded}
-        toggleStatus={isPanelExpanded}
-      />
-      {isPanelExpanded && (
-        <AlertSummaryView
-          data={dataFormattedForFieldBrowser}
-          eventId={eventId}
-          browserFields={browserFields}
-          isDraggable={false}
-          scopeId={'global'}
-          title={HIGHLIGHTED_FIELDS_TITLE}
-          isReadOnly={false} // TODO: set properly
-          goToTable={goToTableTab}
-        />
-      )}
+    <EuiFlexGroup direction="column" gutterSize="s">
+      <EuiFlexItem data-test-subj={HIGHLIGHTED_FIELDS_TITLE_TEST_ID}>
+        <EuiTitle size="xxs">
+          <h5>{HIGHLIGHTED_FIELDS_TITLE}</h5>
+        </EuiTitle>
+      </EuiFlexItem>
+      <EuiFlexItem data-test-subj={HIGHLIGHTED_FIELDS_DETAILS_TEST_ID}>
+        <EuiPanel hasBorder hasShadow={false}>
+          <AlertSummaryView // TODO consider using x-pack/plugins/security_solution/public/common/components/event_details/summary_view.tsx instead if the link to the table have to be removed
+            data={dataFormattedForFieldBrowser}
+            eventId={eventId}
+            browserFields={browserFields}
+            isDraggable={false}
+            scopeId={'global'}
+            title={''}
+            isReadOnly={false} // TODO: set properly
+            goToTable={goToTableTab}
+          />
+        </EuiPanel>
+      </EuiFlexItem>
     </EuiFlexGroup>
   );
 };
diff --git a/x-pack/plugins/security_solution/public/flyout/right/components/investigation_section.stories.tsx b/x-pack/plugins/security_solution/public/flyout/right/components/investigation_section.stories.tsx
new file mode 100644
index 0000000000000..48e763aefaca9
--- /dev/null
+++ b/x-pack/plugins/security_solution/public/flyout/right/components/investigation_section.stories.tsx
@@ -0,0 +1,44 @@
+/*
+ * 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 React from 'react';
+import type { Story } from '@storybook/react';
+import { ExpandableFlyoutContext } from '@kbn/expandable-flyout/src/context';
+import { InvestigationSection } from './investigation_section';
+import { mockDataFormattedForFieldBrowser, mockSearchHit } from '../mocks/mock_context';
+import { RightPanelContext } from '../context';
+
+const flyoutContextValue = {} as unknown as ExpandableFlyoutContext;
+const panelContextValue = {
+  dataFormattedForFieldBrowser: mockDataFormattedForFieldBrowser,
+  searchHit: mockSearchHit,
+} as unknown as RightPanelContext;
+
+export default {
+  component: InvestigationSection,
+  title: 'Flyout/InvestigationSection',
+};
+
+export const Expand: Story<void> = () => {
+  return (
+    <ExpandableFlyoutContext.Provider value={flyoutContextValue}>
+      <RightPanelContext.Provider value={panelContextValue}>
+        <InvestigationSection />
+      </RightPanelContext.Provider>
+    </ExpandableFlyoutContext.Provider>
+  );
+};
+
+export const Collapse: Story<void> = () => {
+  return (
+    <ExpandableFlyoutContext.Provider value={flyoutContextValue}>
+      <RightPanelContext.Provider value={panelContextValue}>
+        <InvestigationSection expanded={false} />
+      </RightPanelContext.Provider>
+    </ExpandableFlyoutContext.Provider>
+  );
+};
diff --git a/x-pack/plugins/security_solution/public/flyout/right/components/investigation_section.test.tsx b/x-pack/plugins/security_solution/public/flyout/right/components/investigation_section.test.tsx
new file mode 100644
index 0000000000000..308fca2d0a465
--- /dev/null
+++ b/x-pack/plugins/security_solution/public/flyout/right/components/investigation_section.test.tsx
@@ -0,0 +1,59 @@
+/*
+ * 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 React from 'react';
+import { render } from '@testing-library/react';
+import {
+  INVESTIGATION_SECTION_CONTENT_TEST_ID,
+  INVESTIGATION_SECTION_HEADER_TEST_ID,
+} from './test_ids';
+import { RightPanelContext } from '../context';
+import { InvestigationSection } from './investigation_section';
+import { ExpandableFlyoutContext } from '@kbn/expandable-flyout/src/context';
+
+const flyoutContextValue = {} as unknown as ExpandableFlyoutContext;
+const panelContextValue = {} as unknown as RightPanelContext;
+
+describe('<InvestigationSection />', () => {
+  it('should render the component collapsed', () => {
+    const { getByTestId } = render(
+      <ExpandableFlyoutContext.Provider value={flyoutContextValue}>
+        <RightPanelContext.Provider value={panelContextValue}>
+          <InvestigationSection />
+        </RightPanelContext.Provider>
+      </ExpandableFlyoutContext.Provider>
+    );
+
+    expect(getByTestId(INVESTIGATION_SECTION_HEADER_TEST_ID)).toBeInTheDocument();
+  });
+
+  it('should render the component expanded', () => {
+    const { getByTestId } = render(
+      <ExpandableFlyoutContext.Provider value={flyoutContextValue}>
+        <RightPanelContext.Provider value={panelContextValue}>
+          <InvestigationSection expanded={true} />
+        </RightPanelContext.Provider>
+      </ExpandableFlyoutContext.Provider>
+    );
+
+    expect(getByTestId(INVESTIGATION_SECTION_HEADER_TEST_ID)).toBeInTheDocument();
+    expect(getByTestId(INVESTIGATION_SECTION_CONTENT_TEST_ID)).toBeInTheDocument();
+  });
+
+  it('should expand the component when clicking on the arrow on header', () => {
+    const { getByTestId } = render(
+      <ExpandableFlyoutContext.Provider value={flyoutContextValue}>
+        <RightPanelContext.Provider value={panelContextValue}>
+          <InvestigationSection />
+        </RightPanelContext.Provider>
+      </ExpandableFlyoutContext.Provider>
+    );
+
+    getByTestId(INVESTIGATION_SECTION_HEADER_TEST_ID).click();
+    expect(getByTestId(INVESTIGATION_SECTION_CONTENT_TEST_ID)).toBeInTheDocument();
+  });
+});
diff --git a/x-pack/plugins/security_solution/public/flyout/right/components/investigation_section.tsx b/x-pack/plugins/security_solution/public/flyout/right/components/investigation_section.tsx
new file mode 100644
index 0000000000000..8c28a2f80469a
--- /dev/null
+++ b/x-pack/plugins/security_solution/public/flyout/right/components/investigation_section.tsx
@@ -0,0 +1,37 @@
+/*
+ * 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 { VFC } from 'react';
+import React from 'react';
+import { ExpandableSection } from './expandable_section';
+import { HighlightedFields } from './highlighted_fields';
+import { INVESTIGATION_SECTION_TEST_ID } from './test_ids';
+import { INVESTIGATION_TITLE } from './translations';
+
+export interface DescriptionSectionProps {
+  /**
+   * Boolean to allow the component to be expanded or collapsed on first render
+   */
+  expanded?: boolean;
+}
+
+/**
+ * Most top section of the overview tab. It contains the description, reason and mitre attack information (for a document of type alert).
+ */
+export const InvestigationSection: VFC<DescriptionSectionProps> = ({ expanded = false }) => {
+  return (
+    <ExpandableSection
+      expanded={expanded}
+      title={INVESTIGATION_TITLE}
+      data-test-subj={INVESTIGATION_SECTION_TEST_ID}
+    >
+      <HighlightedFields />
+    </ExpandableSection>
+  );
+};
+
+InvestigationSection.displayName = 'InvestigationSection';
diff --git a/x-pack/plugins/security_solution/public/flyout/right/components/test_ids.ts b/x-pack/plugins/security_solution/public/flyout/right/components/test_ids.ts
index 4a6ceabae57e3..a18a127cafb51 100644
--- a/x-pack/plugins/security_solution/public/flyout/right/components/test_ids.ts
+++ b/x-pack/plugins/security_solution/public/flyout/right/components/test_ids.ts
@@ -7,11 +7,23 @@
 
 import { CONTENT_TEST_ID, HEADER_TEST_ID } from './expandable_section';
 
+/* Header */
+
 export const FLYOUT_HEADER_TITLE_TEST_ID = 'securitySolutionDocumentDetailsFlyoutHeaderTitle';
 export const EXPAND_DETAILS_BUTTON_TEST_ID =
   'securitySolutionDocumentDetailsFlyoutHeaderExpandDetailButton';
 export const COLLAPSE_DETAILS_BUTTON_TEST_ID =
   'securitySolutionDocumentDetailsFlyoutHeaderCollapseDetailButton';
+export const FLYOUT_HEADER_SEVERITY_TITLE_TEST_ID =
+  'securitySolutionAlertDetailsFlyoutHeaderSeverityTitle';
+export const FLYOUT_HEADER_SEVERITY_VALUE_TEST_ID = 'severity';
+export const FLYOUT_HEADER_RISK_SCORE_TITLE_TEST_ID =
+  'securitySolutionAlertDetailsFlyoutHeaderRiskScoreTitle';
+export const FLYOUT_HEADER_RISK_SCORE_VALUE_TEST_ID =
+  'securitySolutionAlertDetailsFlyoutHeaderRiskScoreValue';
+
+/* Description section */
+
 export const DESCRIPTION_SECTION_TEST_ID =
   'securitySolutionDocumentDetailsFlyoutDescriptionSection';
 export const DESCRIPTION_SECTION_HEADER_TEST_ID = DESCRIPTION_SECTION_TEST_ID + HEADER_TEST_ID;
@@ -25,15 +37,18 @@ export const REASON_TITLE_TEST_ID = 'securitySolutionDocumentDetailsFlyoutReason
 export const REASON_DETAILS_TEST_ID = 'securitySolutionDocumentDetailsFlyoutReasonDetails';
 export const MITRE_ATTACK_TITLE_TEST_ID = 'securitySolutionAlertDetailsFlyoutMitreAttackTitle';
 export const MITRE_ATTACK_DETAILS_TEST_ID = 'securitySolutionAlertDetailsFlyoutMitreAttackDetails';
-export const FLYOUT_HEADER_SEVERITY_TITLE_TEST_ID =
-  'securitySolutionAlertDetailsFlyoutHeaderSeverityTitle';
-export const FLYOUT_HEADER_SEVERITY_VALUE_TEST_ID = 'severity';
-export const FLYOUT_HEADER_RISK_SCORE_TITLE_TEST_ID =
-  'securitySolutionAlertDetailsFlyoutHeaderRiskScoreTitle';
-export const FLYOUT_HEADER_RISK_SCORE_VALUE_TEST_ID =
-  'securitySolutionAlertDetailsFlyoutHeaderRiskScoreValue';
+
+/* Investigation section */
+
+export const INVESTIGATION_SECTION_TEST_ID =
+  'securitySolutionDocumentDetailsFlyoutInvestigationSection';
+export const INVESTIGATION_SECTION_HEADER_TEST_ID = INVESTIGATION_SECTION_TEST_ID + HEADER_TEST_ID;
+export const INVESTIGATION_SECTION_CONTENT_TEST_ID =
+  INVESTIGATION_SECTION_TEST_ID + CONTENT_TEST_ID;
+export const HIGHLIGHTED_FIELDS_TITLE_TEST_ID =
+  'securitySolutionDocumentDetailsFlyoutHighlightedFieldsTitle';
+export const HIGHLIGHTED_FIELDS_DETAILS_TEST_ID =
+  'securitySolutionDocumentDetailsFlyoutHighlightedFieldsDetails';
 export const HIGHLIGHTED_FIELDS_TEST_ID = 'securitySolutionDocumentDetailsFlyoutHighlightedFields';
 export const HIGHLIGHTED_FIELDS_HEADER_EXPAND_ICON_TEST_ID = 'query-toggle-header';
-export const HIGHLIGHTED_FIELDS_HEADER_TITLE_TEST_ID = 'header-section-title';
-export const HIGHLIGHTED_FIELDS_DETAILS_TEST_ID = 'summary-view';
 export const HIGHLIGHTED_FIELDS_GO_TO_TABLE_LINK = 'summary-view-go-to-table-link';
diff --git a/x-pack/plugins/security_solution/public/flyout/right/components/translations.ts b/x-pack/plugins/security_solution/public/flyout/right/components/translations.ts
index 3d3a21b7faa0b..51461459c9cc8 100644
--- a/x-pack/plugins/security_solution/public/flyout/right/components/translations.ts
+++ b/x-pack/plugins/security_solution/public/flyout/right/components/translations.ts
@@ -7,6 +7,8 @@
 
 import { i18n } from '@kbn/i18n';
 
+/* Header */
+
 export const EXPAND_DETAILS_BUTTON = i18n.translate(
   'xpack.securitySolution.flyout.documentDetails.expandDetailButton',
   { defaultMessage: 'Expand alert details' }
@@ -36,6 +38,8 @@ export const RISK_SCORE_TITLE = i18n.translate(
   }
 );
 
+/* Description section */
+
 export const DESCRIPTION_TITLE = i18n.translate(
   'xpack.securitySolution.flyout.documentDetails.descriptionTitle',
   {
@@ -83,6 +87,15 @@ export const DOCUMENT_REASON_TITLE = i18n.translate(
   }
 );
 
+/* Investigation section */
+
+export const INVESTIGATION_TITLE = i18n.translate(
+  'xpack.securitySolution.flyout.documentDetails.investigationSectionTitle',
+  {
+    defaultMessage: 'Investigation',
+  }
+);
+
 export const HIGHLIGHTED_FIELDS_TITLE = i18n.translate(
   'xpack.securitySolution.flyout.documentDetails.highlightedFieldsTitle',
   { defaultMessage: 'Highlighted fields' }
diff --git a/x-pack/plugins/security_solution/public/flyout/right/tabs/overview_tab.tsx b/x-pack/plugins/security_solution/public/flyout/right/tabs/overview_tab.tsx
index d5da888c153fb..8a955e0bbe9a0 100644
--- a/x-pack/plugins/security_solution/public/flyout/right/tabs/overview_tab.tsx
+++ b/x-pack/plugins/security_solution/public/flyout/right/tabs/overview_tab.tsx
@@ -7,9 +7,9 @@
 
 import type { FC } from 'react';
 import React, { memo } from 'react';
-import { EuiHorizontalRule, EuiPanel } from '@elastic/eui';
+import { EuiHorizontalRule } from '@elastic/eui';
+import { InvestigationSection } from '../components/investigation_section';
 import { DescriptionSection } from '../components/description_section';
-import { HighlightedFields } from '../components/highlighted_fields';
 
 /**
  * Overview view displayed in the document details expandable flyout right section
@@ -19,9 +19,7 @@ export const OverviewTab: FC = memo(() => {
     <>
       <DescriptionSection />
       <EuiHorizontalRule margin="l" />
-      <EuiPanel hasBorder hasShadow={false}>
-        <HighlightedFields />
-      </EuiPanel>
+      <InvestigationSection />
     </>
   );
 });