[8.18] [Security Solution] Enable visualization in flyout advanced se…

…tting (#211319) (#211842)

# Backport

This will backport the following commits from `main` to `8.18`:
- [[Security Solution] Enable visualization in flyout advanced setting
(#211319)](#211319)

<!--- Backport version: 9.6.6 -->

### Questions ?
Please refer to the [Backport tool
documentation](https://github.com/sorenlouv/backport)

<!--BACKPORT
[{"author":{"name":"christineweng","email":"18648970+christineweng@users.noreply.github.com"},"sourceCommit":{"committedDate":"2025-02-19T19:43:06Z","message":"[Security
Solution] Enable visualization in flyout advanced setting
(#211319)\n\n## Summary\n\nEnable advanced setting by default\n\n✅
ESS\n\n![image](https://github.com/user-attachments/assets/1373da36-bb82-4f03-b76f-4030fc918a90)\n\n✅
Serverless\n\n\n![image](https://github.com/user-attachments/assets/7dc517b4-fd12-45f4-bf61-f43c379039cb)","sha":"afa67a99119dc3ebab5404025b362c9ed1d828cb","branchLabelMapping":{"^v9.1.0$":"main","^v8.19.0$":"8.x","^v(\\d+).(\\d+).\\d+$":"$1.$2"}},"sourcePullRequest":{"labels":["release_note:skip","v9.0.0","Team:Threat
Hunting:Investigations","backport:version","v8.18.0","v9.1.0","v8.19.0"],"title":"[Security
Solution] Enable visualization in flyout advanced
setting","number":211319,"url":"https://github.com/elastic/kibana/pull/211319","mergeCommit":{"message":"[Security
Solution] Enable visualization in flyout advanced setting
(#211319)\n\n## Summary\n\nEnable advanced setting by default\n\n✅
ESS\n\n![image](https://github.com/user-attachments/assets/1373da36-bb82-4f03-b76f-4030fc918a90)\n\n✅
Serverless\n\n\n![image](https://github.com/user-attachments/assets/7dc517b4-fd12-45f4-bf61-f43c379039cb)","sha":"afa67a99119dc3ebab5404025b362c9ed1d828cb"}},"sourceBranch":"main","suggestedTargetBranches":["9.0","8.18","8.x"],"targetPullRequestStates":[{"branch":"9.0","label":"v9.0.0","branchLabelMappingKey":"^v(\\d+).(\\d+).\\d+$","isSourceBranch":false,"state":"NOT_CREATED"},{"branch":"8.18","label":"v8.18.0","branchLabelMappingKey":"^v(\\d+).(\\d+).\\d+$","isSourceBranch":false,"state":"NOT_CREATED"},{"branch":"main","label":"v9.1.0","branchLabelMappingKey":"^v9.1.0$","isSourceBranch":true,"state":"MERGED","url":"https://github.com/elastic/kibana/pull/211319","number":211319,"mergeCommit":{"message":"[Security
Solution] Enable visualization in flyout advanced setting
(#211319)\n\n## Summary\n\nEnable advanced setting by default\n\n✅
ESS\n\n![image](https://github.com/user-attachments/assets/1373da36-bb82-4f03-b76f-4030fc918a90)\n\n✅
Serverless\n\n\n![image](https://github.com/user-attachments/assets/7dc517b4-fd12-45f4-bf61-f43c379039cb)","sha":"afa67a99119dc3ebab5404025b362c9ed1d828cb"}},{"branch":"8.x","label":"v8.19.0","branchLabelMappingKey":"^v8.19.0$","isSourceBranch":false,"state":"NOT_CREATED"}]}]
BACKPORT-->

Co-authored-by: christineweng <18648970+christineweng@users.noreply.github.com>

x-pack/platform/plugins/private/translations/translations/fr-FR.json

@@ -42389,7 +42389,6 @@
     "xpack.securitySolution.uiSettings.enableCcsWarningDescription": "<p>Active les avertissements de vérification des privilèges dans les règles relatives aux index CCS</p>",
     "xpack.securitySolution.uiSettings.enableNewsFeedDescription": "<p>Active le fil d'actualités</p>",
     "xpack.securitySolution.uiSettings.enableNewsFeedLabel": "Fil d'actualités",
-    "xpack.securitySolution.uiSettings.enableVisualizationsInFlyoutDescription": "<em>[version d'évaluation technique]</em> Activez les visualisations (analyseur et visualiseur de session) dans le menu volant.",
     "xpack.securitySolution.uiSettings.enableVisualizationsInFlyoutLabel": "Activer les visualisations dans le menu volant",
     "xpack.securitySolution.uiSettings.excludeColdAndFrozenTiersInAnalyzer": "Exclure les niveaux froids de l'analyseur",
     "xpack.securitySolution.uiSettings.excludeColdAndFrozenTiersInAnalyzerDescription": "<p>Lorsque cette option est activée, les niveaux \"cold\" et \"frozen\" sont ignorés dans les requêtes de l'analyseur</p>",

x-pack/platform/plugins/private/translations/translations/ja-JP.json

@@ -42246,7 +42246,6 @@
     "xpack.securitySolution.uiSettings.enableCcsWarningDescription": "<p>CCSインデックスのルールで権限チェック警告を有効にします</p>",
     "xpack.securitySolution.uiSettings.enableNewsFeedDescription": "<p>ニュースフィードを有効にします</p>",
     "xpack.securitySolution.uiSettings.enableNewsFeedLabel": "ニュースフィード",
-    "xpack.securitySolution.uiSettings.enableVisualizationsInFlyoutDescription": "<em>［テクニカルプレビュー］</em>フライアウトで視覚化（アナライザーとセッションビューアー）を有効にします。",
     "xpack.securitySolution.uiSettings.enableVisualizationsInFlyoutLabel": "フライアウトでビジュアライゼーションを有効化",
     "xpack.securitySolution.uiSettings.excludeColdAndFrozenTiersInAnalyzer": "アナライザーでコールドティアとフローズンティアを除外",
     "xpack.securitySolution.uiSettings.excludeColdAndFrozenTiersInAnalyzerDescription": "<p>有効にすると、アナライザークエリーでコールドティアとフローズンティアがスキップされます</p>",

x-pack/platform/plugins/private/translations/translations/zh-CN.json

@@ -42342,7 +42342,6 @@
     "xpack.securitySolution.uiSettings.enableCcsWarningDescription": "<p>在规则中为 CCS 索引启用权限检查警告</p>",
     "xpack.securitySolution.uiSettings.enableNewsFeedDescription": "<p>启用新闻源</p>",
     "xpack.securitySolution.uiSettings.enableNewsFeedLabel": "新闻源",
-    "xpack.securitySolution.uiSettings.enableVisualizationsInFlyoutDescription": "<em>[技术预览]</em> 在浮出控件中启用可视化（分析器和会话查看器）。",
     "xpack.securitySolution.uiSettings.enableVisualizationsInFlyoutLabel": "在浮出控件中启用可视化",
     "xpack.securitySolution.uiSettings.excludeColdAndFrozenTiersInAnalyzer": "在分析器中排除冷层和冻结层",
     "xpack.securitySolution.uiSettings.excludeColdAndFrozenTiersInAnalyzerDescription": "<p>启用后，将在分析器查询中跳过冷层和冻结层</p>",

x-pack/solutions/security/plugins/security_solution/server/ui_settings.ts

@@ -209,13 +209,12 @@ export const initUiSettings = (
     },
     [ENABLE_VISUALIZATIONS_IN_FLYOUT_SETTING]: {
       name: enableVisualizationsInFlyoutLabel,
-      value: false,
+      value: true,
       description: i18n.translate(
         'xpack.securitySolution.uiSettings.enableVisualizationsInFlyoutDescription',
         {
           defaultMessage:
-            '<em>[technical preview]</em> Enable visualizations (analyzer and session viewer) in flyout.',
-          values: { em: (chunks) => `<em>${chunks}</em>` },
+            'Enable visualizations (analyzer and session viewer) in document details flyout.',
         }
       ),
       type: 'boolean',

x-pack/test/security_solution_cypress/cypress/e2e/investigations/alerts/alert_table_action_column.cy.ts

@@ -5,7 +5,6 @@
  * 2.0.
  */
 
-import { OVERLAY_CONTAINER } from '../../../screens/alerts';
 import {
   openAnalyzerForFirstAlertInTimeline,
   openSessionViewerFromAlertTable,
@@ -14,6 +13,12 @@ import { waitForAlertsToPopulate } from '../../../tasks/create_new_rule';
 import { login } from '../../../tasks/login';
 import { visitWithTimeRange } from '../../../tasks/navigation';
 import { ALERTS_URL } from '../../../urls/navigation';
+import { DOCUMENT_DETAILS_FLYOUT_VISUALIZE_TAB } from '../../../screens/expandable_flyout/alert_details_left_panel';
+import { DOCUMENT_DETAILS_FLYOUT_VISUALIZE_TAB_SESSION_VIEW_BUTTON } from '../../../screens/expandable_flyout/alert_details_left_panel_session_view_tab';
+import {
+  DOCUMENT_DETAILS_FLYOUT_VISUALIZE_TAB_GRAPH_ANALYZER_BUTTON,
+  DOCUMENT_DETAILS_FLYOUT_VISUALIZE_TAB_GRAPH_ANALYZER_CONTENT,
+} from '../../../screens/expandable_flyout/alert_details_left_panel_analyzer_graph_tab';
 
 describe('Alerts Table Action column', { tags: ['@ess', '@serverless'] }, () => {
   before(() => {
@@ -36,11 +41,22 @@ describe('Alerts Table Action column', { tags: ['@ess', '@serverless'] }, () =>
 
   it('should have session viewer button visible & open session viewer on click', () => {
     openSessionViewerFromAlertTable();
-    cy.get(OVERLAY_CONTAINER).should('be.visible');
+    cy.get(DOCUMENT_DETAILS_FLYOUT_VISUALIZE_TAB)
+      .should('have.text', 'Visualize')
+      .and('have.class', 'euiTab-isSelected');
+    cy.get(DOCUMENT_DETAILS_FLYOUT_VISUALIZE_TAB_SESSION_VIEW_BUTTON)
+      .should('have.text', 'Session View')
+      .and('have.class', 'euiButtonGroupButton-isSelected');
   });
 
   it('should have analyzer button visible & open analyzer on click', () => {
     openAnalyzerForFirstAlertInTimeline();
-    cy.get(OVERLAY_CONTAINER).should('be.visible');
+    cy.get(DOCUMENT_DETAILS_FLYOUT_VISUALIZE_TAB)
+      .should('have.text', 'Visualize')
+      .and('have.class', 'euiTab-isSelected');
+    cy.get(DOCUMENT_DETAILS_FLYOUT_VISUALIZE_TAB_GRAPH_ANALYZER_BUTTON)
+      .should('have.text', 'Analyzer Graph')
+      .and('have.class', 'euiButtonGroupButton-isSelected');
+    cy.get(DOCUMENT_DETAILS_FLYOUT_VISUALIZE_TAB_GRAPH_ANALYZER_CONTENT).should('exist');
   });
 });

x-pack/test/security_solution_cypress/cypress/e2e/investigations/alerts/expandable_flyout/alert_details_left_panel_analyzer_graph_tab.cy.ts

@@ -22,8 +22,7 @@ import { getNewRule } from '../../../../objects/rule';
 import { ALERTS_URL } from '../../../../urls/navigation';
 import { waitForAlertsToPopulate } from '../../../../tasks/create_new_rule';
 
-// TODO enable once the visualize tabs are back
-describe.skip(
+describe(
   'Alert details expandable flyout left panel analyzer graph',
   { tags: ['@ess', '@skipInServerless'] },
   () => {

x-pack/test/security_solution_cypress/cypress/e2e/investigations/alerts/expandable_flyout/alert_details_left_panel_session_view_tab.cy.ts

@@ -17,8 +17,7 @@ import { getNewRule } from '../../../../objects/rule';
 import { ALERTS_URL } from '../../../../urls/navigation';
 import { waitForAlertsToPopulate } from '../../../../tasks/create_new_rule';
 
-// TODO enable once the visualize tabs are back
-describe.skip(
+describe(
   'Alert details expandable flyout left panel session view',
   { tags: ['@ess', '@serverless'] },
   () => {

x-pack/test/security_solution_cypress/cypress/e2e/investigations/alerts/investigate_in_timeline.cy.ts

@@ -6,12 +6,7 @@
  */
 
 import { getNewRule } from '../../../objects/rule';
-import {
-  ANALYZER_GRAPH_TAB_BUTTON,
-  PROVIDER_BADGE,
-  QUERY_TAB_BUTTON,
-  TIMELINE_TITLE,
-} from '../../../screens/timeline';
+import { PROVIDER_BADGE, QUERY_TAB_BUTTON, TIMELINE_TITLE } from '../../../screens/timeline';
 import { closeTimeline } from '../../../tasks/timeline';
 import { investigateFirstAlertInTimeline } from '../../../tasks/alerts';
 import { createRule } from '../../../tasks/api_calls/rules';
@@ -22,7 +17,7 @@ import { ALERTS_URL } from '../../../urls/navigation';
 import { deleteAlertsAndRules } from '../../../tasks/api_calls/common';
 import { expandAlertAtIndexExpandableFlyout } from '../../../tasks/expandable_flyout/common';
 import {
-  clickAnalyzerPreviewTitleToOpenTimeline,
+  clickAnalyzerPreviewTitle,
   toggleOverviewTabAboutSection,
   toggleOverviewTabInvestigationSection,
   toggleOverviewTabVisualizationsSection,
@@ -33,6 +28,11 @@ import {
   selectTakeActionItem,
 } from '../../../tasks/expandable_flyout/alert_details_right_panel';
 import { DOCUMENT_DETAILS_FLYOUT_FOOTER_INVESTIGATE_IN_TIMELINE } from '../../../screens/expandable_flyout/alert_details_right_panel';
+import { DOCUMENT_DETAILS_FLYOUT_VISUALIZE_TAB } from '../../../screens/expandable_flyout/alert_details_left_panel';
+import {
+  DOCUMENT_DETAILS_FLYOUT_VISUALIZE_TAB_GRAPH_ANALYZER_BUTTON,
+  DOCUMENT_DETAILS_FLYOUT_VISUALIZE_TAB_GRAPH_ANALYZER_CONTENT,
+} from '../../../screens/expandable_flyout/alert_details_left_panel_analyzer_graph_tab';
 import {
   openTimelineFromPrevalenceTableCell,
   openPrevalenceTab,
@@ -43,6 +43,7 @@ import {
   openTimelineFromRelatedBySession,
   openTimelineFromRelatedSourceEvent,
 } from '../../../tasks/expandable_flyout/alert_details_left_panel_correlations_tab';
+import { openInsightsTab } from '../../../tasks/expandable_flyout/alert_details_left_panel';
 
 describe(
   'Investigate in timeline',
@@ -83,18 +84,25 @@ describe(
         cy.get(QUERY_TAB_BUTTON).should('have.class', 'euiTab-isSelected');
       });
 
-      it('should open a new timeline from analyzer graph preview', () => {
+      it('should navigate to analyzer graph tab', () => {
         toggleOverviewTabAboutSection();
         toggleOverviewTabInvestigationSection();
         toggleOverviewTabVisualizationsSection();
-        clickAnalyzerPreviewTitleToOpenTimeline();
+        clickAnalyzerPreviewTitle();
 
-        cy.get(TIMELINE_TITLE).should('have.text', 'Untitled timeline');
-        cy.get(ANALYZER_GRAPH_TAB_BUTTON).should('have.class', 'euiTab-isSelected');
+        cy.get(DOCUMENT_DETAILS_FLYOUT_VISUALIZE_TAB)
+          .should('have.text', 'Visualize')
+          .and('have.class', 'euiTab-isSelected');
+        cy.get(DOCUMENT_DETAILS_FLYOUT_VISUALIZE_TAB_GRAPH_ANALYZER_BUTTON)
+          .should('have.text', 'Analyzer Graph')
+          .and('have.class', 'euiButtonGroupButton-isSelected');
+
+        cy.get(DOCUMENT_DETAILS_FLYOUT_VISUALIZE_TAB_GRAPH_ANALYZER_CONTENT).should('exist');
       });
 
       it('should open a new timeline from the prevalence detail table', () => {
         expandDocumentDetailsExpandableFlyoutLeftSection();
+        openInsightsTab();
         openPrevalenceTab();
         openTimelineFromPrevalenceTableCell();
 
@@ -104,6 +112,7 @@ describe(
 
       it('should open a new timeline from the correlations tab', () => {
         expandDocumentDetailsExpandableFlyoutLeftSection();
+        openInsightsTab();
         openCorrelationsTab();
         openTimelineFromRelatedSourceEvent();
 

x-pack/test/security_solution_cypress/cypress/tasks/expandable_flyout/alert_details_right_panel_overview_tab.ts

@@ -130,6 +130,6 @@ export const navigateToResponseDetails = () => {
 /**
  * Click the Response button to open the response detail tab in the left section
  */
-export const clickAnalyzerPreviewTitleToOpenTimeline = () => {
+export const clickAnalyzerPreviewTitle = () => {
   cy.get(DOCUMENT_DETAILS_FLYOUT_OVERVIEW_TAB_ANALYZER_PREVIEW_TITLE_LINK).click();
 };