advanced setting

packages/kbn-management/settings/setting_ids/index.ts

@@ -189,6 +189,8 @@ export const SECURITY_SOLUTION_EXCLUDE_COLD_AND_FROZEN_TIERS_IN_ANALYZER =
 /** This Kibana Advanced Setting allows users to enable/disable the Asset Criticality feature */
 export const SECURITY_SOLUTION_ENABLE_ASSET_CRITICALITY_SETTING =
   'securitySolution:enableAssetCriticality' as const;
+export const SECURITY_SOLUTION_ENABLE_VISUALIZATIONS_IN_FLYOUT_SETTING =
+  'securitySolution:enableVisualizationsInFlyout' as const;
 
 // Timelion settings
 export const TIMELION_ES_DEFAULT_INDEX_ID = 'timelion:es.default_index';

src/plugins/kibana_usage_collection/server/collectors/management/schema.ts

@@ -130,6 +130,10 @@ export const stackManagementSchema: MakeSchemaFrom<UsageStats> = {
     type: 'boolean',
     _meta: { description: 'Non-default value of setting.' },
   },
+  'securitySolution:enableVisualizationsInFlyout': {
+    type: 'boolean',
+    _meta: { description: 'Non-default value of setting.' },
+  },
   'search:includeFrozen': {
     type: 'boolean',
     _meta: { description: 'Non-default value of setting.' },

src/plugins/kibana_usage_collection/server/collectors/management/types.ts

@@ -77,6 +77,7 @@ export interface UsageStats {
   'securitySolution:enableAssetCriticality': boolean;
   'securitySolution:excludeColdAndFrozenTiersInAnalyzer': boolean;
   'securitySolution:enableCcsWarning': boolean;
+  'securitySolution:enableVisualizationsInFlyout': boolean;
   'search:includeFrozen': boolean;
   'courier:maxConcurrentShardRequests': number;
   'courier:setRequestPreference': string;

src/plugins/telemetry/schema/oss_plugins.json

@@ -9788,6 +9788,12 @@
             "description": "Non-default value of setting."
           }
         },
+        "securitySolution:enableVisualizationsInFlyout":{
+          "type": "boolean",
+          "_meta": {
+            "description": "Non-default value of setting."
+          }
+        },
         "search:includeFrozen": {
           "type": "boolean",
           "_meta": {

x-pack/plugins/security_solution/common/constants.ts

@@ -199,6 +199,10 @@ export const ENABLE_ASSET_CRITICALITY_SETTING = 'securitySolution:enableAssetCri
 export const EXCLUDED_DATA_TIERS_FOR_RULE_EXECUTION =
   'securitySolution:excludedDataTiersForRuleExecution' as const;
 
+/** This Kibana Advanced Setting allows users to enable/disable the Visualizations in Flyout feature */
+export const ENABLE_VISUALIZATIONS_IN_FLYOUT_SETTING =
+  'securitySolution:enableVisualizationsInFlyout' as const;
+
 /**
  * Id for the notifications alerting type
  * @deprecated Once we are confident all rules relying on side-car actions SO's have been migrated to SO references we should remove this function

x-pack/plugins/security_solution/common/experimental_features.ts

@@ -183,11 +183,6 @@ export const allowedExperimentalValues = Object.freeze({
    */
   analyzerDatePickersAndSourcererDisabled: false,
 
-  /**
-   * Enables visualization: session viewer and analyzer in expandable flyout
-   */
-  visualizationInFlyoutEnabled: false,
-
   /**
    * Enables an ability to customize Elastic prebuilt rules.
    *

x-pack/plugins/security_solution/public/flyout/document_details/left/index.tsx

@@ -9,7 +9,9 @@ import type { FC } from 'react';
 import React, { memo, useMemo } from 'react';
 
 import { useExpandableFlyoutApi } from '@kbn/expandable-flyout';
+import { useUiSetting$ } from '@kbn/kibana-react-plugin/public';
 import { useIsExperimentalFeatureEnabled } from '../../../common/hooks/use_experimental_features';
+import { ENABLE_VISUALIZATIONS_IN_FLYOUT_SETTING } from '../../../../common/constants';
 import { DocumentDetailsLeftPanelKey } from '../shared/constants/panel_keys';
 import { useKibana } from '../../../common/lib/kibana';
 import { PanelHeader } from './header';
@@ -38,8 +40,8 @@ export const LeftPanel: FC<Partial<DocumentDetailsProps>> = memo(({ path }) => {
     'securitySolutionNotesEnabled'
   );
 
-  const visualizationInFlyoutEnabled = useIsExperimentalFeatureEnabled(
-    'visualizationInFlyoutEnabled'
+  const [visualizationInFlyoutEnabled] = useUiSetting$<boolean>(
+    ENABLE_VISUALIZATIONS_IN_FLYOUT_SETTING
   );
 
   const tabsDisplayed = useMemo(() => {

x-pack/plugins/security_solution/public/flyout/document_details/right/components/analyzer_preview_container.test.tsx

@@ -24,7 +24,6 @@ import {
   EXPANDABLE_PANEL_TOGGLE_ICON_TEST_ID,
 } from '@kbn/security-solution-common';
 import { mockFlyoutApi } from '../../shared/mocks/mock_flyout_context';
-import { useIsExperimentalFeatureEnabled } from '../../../../common/hooks/use_experimental_features';
 import { mockDataFormattedForFieldBrowser } from '../../shared/mocks/mock_data_formatted_for_field_browser';
 import { useInvestigateInTimeline } from '../../../../detections/components/alerts_table/timeline_actions/use_investigate_in_timeline';
 import { useWhichFlyout } from '../../shared/hooks/use_which_flyout';
@@ -59,8 +58,14 @@ jest.mock('react-redux', () => {
   };
 });
 
-jest.mock('../../../../common/hooks/use_experimental_features');
-const mockUseIsExperimentalFeatureEnabled = useIsExperimentalFeatureEnabled as jest.Mock;
+const mockUseUiSetting = jest.fn().mockReturnValue([false]);
+jest.mock('@kbn/kibana-react-plugin/public', () => {
+  const original = jest.requireActual('@kbn/kibana-react-plugin/public');
+  return {
+    ...original,
+    useUiSetting$: () => mockUseUiSetting(),
+  };
+});
 
 const NO_ANALYZER_MESSAGE =
   'You can only visualize events triggered by hosts configured with the Elastic Defend integration or any sysmon data from winlogbeat. Refer to Visual event analyzerExternal link(opens in a new tab or window) for more information.';
@@ -84,7 +89,6 @@ describe('AnalyzerPreviewContainer', () => {
     jest.clearAllMocks();
     mockUseWhichFlyout.mockReturnValue(FLYOUT_KEY);
     jest.mocked(useExpandableFlyoutApi).mockReturnValue(mockFlyoutApi);
-    mockUseIsExperimentalFeatureEnabled.mockReturnValue(false);
   });
 
   it('should render component and link in header', () => {
@@ -181,7 +185,7 @@ describe('AnalyzerPreviewContainer', () => {
 
   describe('when visualizationInFlyoutEnabled is enabled', () => {
     it('should open left flyout visualization tab when clicking on title', () => {
-      mockUseIsExperimentalFeatureEnabled.mockReturnValue(true);
+      mockUseUiSetting.mockReturnValue([true]);
 
       (useIsInvestigateInResolverActionEnabled as jest.Mock).mockReturnValue(true);
       (useAlertPrevalenceFromProcessTree as jest.Mock).mockReturnValue({
@@ -219,7 +223,7 @@ describe('AnalyzerPreviewContainer', () => {
     });
 
     it('should not disable link when in rule preview', () => {
-      mockUseIsExperimentalFeatureEnabled.mockReturnValue(true);
+      mockUseUiSetting.mockReturnValue([true]);
       (useIsInvestigateInResolverActionEnabled as jest.Mock).mockReturnValue(true);
       (useAlertPrevalenceFromProcessTree as jest.Mock).mockReturnValue({
         loading: false,

x-pack/plugins/security_solution/public/flyout/document_details/right/components/analyzer_preview_container.tsx

@@ -12,7 +12,8 @@ import { EuiLink, EuiMark } from '@elastic/eui';
 import { FormattedMessage } from '@kbn/i18n-react';
 import { ExpandablePanel } from '@kbn/security-solution-common';
 import { useExpandableFlyoutApi } from '@kbn/expandable-flyout';
-import { useIsExperimentalFeatureEnabled } from '../../../../common/hooks/use_experimental_features';
+import { useUiSetting$ } from '@kbn/kibana-react-plugin/public';
+import { ENABLE_VISUALIZATIONS_IN_FLYOUT_SETTING } from '../../../../../common/constants';
 import { useWhichFlyout } from '../../shared/hooks/use_which_flyout';
 import {
   DocumentDetailsLeftPanelKey,
@@ -42,8 +43,8 @@ export const AnalyzerPreviewContainer: React.FC = () => {
   const { openLeftPanel, openPreviewPanel } = useExpandableFlyoutApi();
   const key = useWhichFlyout() ?? 'memory';
 
-  const visualizationInFlyoutEnabled = useIsExperimentalFeatureEnabled(
-    'visualizationInFlyoutEnabled'
+  const [visualizationInFlyoutEnabled] = useUiSetting$<boolean>(
+    ENABLE_VISUALIZATIONS_IN_FLYOUT_SETTING
   );
   // decide whether to show the analyzer preview or not
   const isEnabled = useIsInvestigateInResolverActionEnabled(dataAsNestedObject);

x-pack/plugins/security_solution/public/flyout/document_details/right/components/visualizations_section.test.tsx

@@ -24,17 +24,13 @@ import { TestProvider } from '@kbn/expandable-flyout/src/test/provider';
 import { useExpandSection } from '../hooks/use_expand_section';
 import { useInvestigateInTimeline } from '../../../../detections/components/alerts_table/timeline_actions/use_investigate_in_timeline';
 import { useIsInvestigateInResolverActionEnabled } from '../../../../detections/components/alerts_table/timeline_actions/investigate_in_resolver';
-import { useIsExperimentalFeatureEnabled } from '../../../../common/hooks/use_experimental_features';
 
 jest.mock('../hooks/use_expand_section');
 jest.mock('../../shared/hooks/use_alert_prevalence_from_process_tree', () => ({
   useAlertPrevalenceFromProcessTree: jest.fn(),
 }));
 const mockUseAlertPrevalenceFromProcessTree = useAlertPrevalenceFromProcessTree as jest.Mock;
 
-jest.mock('../../../../common/hooks/use_experimental_features');
-const mockUseIsExperimentalFeatureEnabled = useIsExperimentalFeatureEnabled as jest.Mock;
-
 jest.mock('../../../../timelines/containers/use_timeline_data_filters', () => ({
   useTimelineDataFilters: jest.fn(),
 }));
@@ -54,6 +50,15 @@ jest.mock(
   '../../../../detections/components/alerts_table/timeline_actions/investigate_in_resolver'
 );
 
+const mockUseUiSetting = jest.fn().mockReturnValue([false]);
+jest.mock('@kbn/kibana-react-plugin/public', () => {
+  const original = jest.requireActual('@kbn/kibana-react-plugin/public');
+  return {
+    ...original,
+    useUiSetting$: () => mockUseUiSetting(),
+  };
+});
+
 const panelContextValue = {
   ...mockContextValue,
   dataFormattedForFieldBrowser: mockDataFormattedForFieldBrowser,
@@ -72,7 +77,6 @@ const renderVisualizationsSection = (contextValue = panelContextValue) =>
 
 describe('<VisualizationsSection />', () => {
   beforeEach(() => {
-    mockUseIsExperimentalFeatureEnabled.mockReturnValue(false);
     mockUseTimelineDataFilters.mockReturnValue({ selectedPatterns: ['index'] });
     mockUseAlertPrevalenceFromProcessTree.mockReturnValue({
       loading: false,

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

@@ -39,6 +39,7 @@ import {
   EXCLUDE_COLD_AND_FROZEN_TIERS_IN_ANALYZER,
   EXCLUDED_DATA_TIERS_FOR_RULE_EXECUTION,
   ENABLE_ASSET_CRITICALITY_SETTING,
+  ENABLE_VISUALIZATIONS_IN_FLYOUT_SETTING,
 } from '../common/constants';
 import type { ExperimentalFeatures } from '../common/experimental_features';
 import { LogLevelSetting } from '../common/api/detection_engine/rule_monitoring';
@@ -216,6 +217,23 @@ export const initUiSettings = (
       requiresPageReload: true,
       schema: schema.boolean(),
     },
+    [ENABLE_VISUALIZATIONS_IN_FLYOUT_SETTING]: {
+      name: i18n.translate('xpack.securitySolution.uiSettings.enableVisualizationsInFlyoutLabel', {
+        defaultMessage: 'Enable visualizations in flyout',
+      }),
+      value: false,
+      description: i18n.translate(
+        'xpack.securitySolution.uiSettings.enableVisualizationsInFlyoutDescription',
+        {
+          defaultMessage: '<p>Enables visualizations in the alerts flyout</p>',
+          values: { p: (chunks) => `<p>${chunks}</p>` },
+        }
+      ),
+      type: 'boolean',
+      category: [APP_ID],
+      requiresPageReload: true,
+      schema: schema.boolean(),
+    },
     [DEFAULT_RULES_TABLE_REFRESH_SETTING]: {
       name: i18n.translate('xpack.securitySolution.uiSettings.rulesTableRefresh', {
         defaultMessage: 'Rules auto refresh',