From a265300fd46dc7a0b9ef4295fbf47c21903cb3bf Mon Sep 17 00:00:00 2001
From: Charlotte Alexandra Wilson <CAWilson94@users.noreply.github.com>
Date: Tue, 12 Nov 2024 18:21:50 +0000
Subject: [PATCH 1/3] Confirmation Modal - show warning message when nothing
 has been changed in modal.  (#199523)

(cherry picked from commit 5d0b62ce9eb19a23cc8abfd6506be3f0f687ee80)

# Conflicts:
#	x-pack/plugins/security_solution/public/entity_analytics/components/entity_store/components/enablement_modal.tsx
---
 .../components/enablement_modal.test.tsx      | 89 +++++++++++++++++++
 .../components/enablement_modal.tsx           | 50 +++++++++--
 .../components/entity_store/translations.ts   |  7 ++
 3 files changed, 139 insertions(+), 7 deletions(-)
 create mode 100644 x-pack/plugins/security_solution/public/entity_analytics/components/entity_store/components/enablement_modal.test.tsx

diff --git a/x-pack/plugins/security_solution/public/entity_analytics/components/entity_store/components/enablement_modal.test.tsx b/x-pack/plugins/security_solution/public/entity_analytics/components/entity_store/components/enablement_modal.test.tsx
new file mode 100644
index 0000000000000..360e28ec41518
--- /dev/null
+++ b/x-pack/plugins/security_solution/public/entity_analytics/components/entity_store/components/enablement_modal.test.tsx
@@ -0,0 +1,89 @@
+/*
+ * 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 { fireEvent, render, screen } from '@testing-library/react';
+import { EntityStoreEnablementModal } from './enablement_modal';
+import { useEntityEnginePrivileges } from '../hooks/use_entity_engine_privileges';
+import { TestProviders } from '../../../../common/mock';
+
+const mockToggle = jest.fn();
+const mockEnableStore = jest.fn(() => jest.fn());
+jest.mock('../hooks/use_entity_engine_privileges', () => ({
+  useEntityEnginePrivileges: jest.fn(),
+}));
+
+const defaultProps = {
+  visible: true,
+  toggle: mockToggle,
+  enableStore: mockEnableStore,
+  riskScore: { disabled: false, checked: false },
+  entityStore: { disabled: false, checked: false },
+};
+
+const renderComponent = (props = defaultProps) => {
+  return render(<EntityStoreEnablementModal {...props} />, { wrapper: TestProviders });
+};
+
+describe('EntityStoreEnablementModal', () => {
+  beforeEach(() => {
+    jest.clearAllMocks();
+    (useEntityEnginePrivileges as jest.Mock).mockReturnValue({
+      data: {
+        privileges: {
+          elasticsearch: {
+            index: {},
+          },
+          kibana: {},
+        },
+      },
+      isLoading: false,
+    });
+  });
+
+  it('should render the modal when visible is true', () => {
+    renderComponent();
+    expect(screen.getByRole('dialog')).toBeInTheDocument();
+  });
+
+  it('should not render the modal when visible is false', () => {
+    renderComponent({ ...defaultProps, visible: false });
+    expect(screen.queryByRole('dialog')).not.toBeInTheDocument();
+  });
+
+  it('should call toggle function when cancel button is clicked', () => {
+    renderComponent();
+    fireEvent.click(screen.getByText('Cancel'));
+    expect(mockToggle).toHaveBeenCalledWith(false);
+  });
+
+  it('should call enableStore function when enable button is clicked', () => {
+    renderComponent({
+      ...defaultProps,
+      riskScore: { ...defaultProps.riskScore, checked: true },
+      entityStore: { ...defaultProps.entityStore, checked: true },
+    });
+    fireEvent.click(screen.getByText('Enable'));
+    expect(mockEnableStore).toHaveBeenCalledWith({ riskScore: true, entityStore: true });
+  });
+
+  it('should display proceed warning when no enablement options are selected', () => {
+    renderComponent();
+    expect(screen.getByText('Please enable at least one option to proceed.')).toBeInTheDocument();
+  });
+
+  it('should disable the enable button when enablementOptions are false', () => {
+    renderComponent({
+      ...defaultProps,
+      riskScore: { ...defaultProps.riskScore, checked: false },
+      entityStore: { ...defaultProps.entityStore, checked: false },
+    });
+
+    const enableButton = screen.getByRole('button', { name: /Enable/i });
+    expect(enableButton).toBeDisabled();
+  });
+});
diff --git a/x-pack/plugins/security_solution/public/entity_analytics/components/entity_store/components/enablement_modal.tsx b/x-pack/plugins/security_solution/public/entity_analytics/components/entity_store/components/enablement_modal.tsx
index bff0fabb3522d..6f44cb1ed67bb 100644
--- a/x-pack/plugins/security_solution/public/entity_analytics/components/entity_store/components/enablement_modal.tsx
+++ b/x-pack/plugins/security_solution/public/entity_analytics/components/entity_store/components/enablement_modal.tsx
@@ -20,13 +20,17 @@ import {
   EuiButtonEmpty,
   EuiBetaBadge,
   EuiToolTip,
+  EuiCallOut,
+  useEuiTheme,
 } from '@elastic/eui';
+import { css } from '@emotion/react';
 import React, { useState } from 'react';
 import { FormattedMessage } from '@kbn/i18n-react';
 import { TECHNICAL_PREVIEW, TECHNICAL_PREVIEW_TOOLTIP } from '../../../../common/translations';
 import {
   ENABLEMENT_DESCRIPTION_RISK_ENGINE_ONLY,
   ENABLEMENT_DESCRIPTION_ENTITY_STORE_ONLY,
+  ENABLEMENT_WARNING_SELECT_TO_PROCEED,
 } from '../translations';
 import { useMissingRiskEnginePrivileges } from '../../../hooks/use_missing_risk_engine_privileges';
 import { RiskEnginePrivilegesCallOut } from '../../risk_engine_privileges_callout';
@@ -57,18 +61,38 @@ export const EntityStoreEnablementModal: React.FC<EntityStoreEnablementModalProp
   riskScore,
   entityStore,
 }) => {
+  const { euiTheme } = useEuiTheme();
   const [enablements, setEnablements] = useState({
     riskScore: !!riskScore.checked,
     entityStore: !!entityStore.checked,
   });
+<<<<<<< HEAD
   const riskEnginePrivileges = useMissingRiskEnginePrivileges();
+=======
+  const { data: privileges, isLoading: isLoadingPrivileges } = useEntityEnginePrivileges();
+  const enablementOptions = enablements.riskScore || enablements.entityStore;
+>>>>>>> 5d0b62ce9eb (Confirmation Modal - show warning message when nothing has been changed in modal.  (#199523))
 
   if (!visible) {
     return null;
   }
+<<<<<<< HEAD
   const hasRiskEnginePrivileges =
     !riskEnginePrivileges.isLoading && riskEnginePrivileges?.hasAllRequiredPrivileges;
 
+=======
+  const proceedWarning = (
+    <EuiCallOut
+      size="s"
+      color="danger"
+      css={css`
+        border-radius: ${euiTheme.border.radius.medium};
+      `}
+    >
+      <p>{ENABLEMENT_WARNING_SELECT_TO_PROCEED}</p>
+    </EuiCallOut>
+  );
+>>>>>>> 5d0b62ce9eb (Confirmation Modal - show warning message when nothing has been changed in modal.  (#199523))
   return (
     <EuiModal onClose={() => toggle(false)}>
       <EuiModalHeader>
@@ -131,13 +155,25 @@ export const EntityStoreEnablementModal: React.FC<EntityStoreEnablementModalProp
       </EuiModalBody>
 
       <EuiModalFooter>
-        <EuiButtonEmpty onClick={() => toggle(false)}>{'Cancel'}</EuiButtonEmpty>
-        <EuiButton onClick={enableStore(enablements)} fill>
-          <FormattedMessage
-            id="xpack.securitySolution.entityAnalytics.enablements.modal.enable"
-            defaultMessage="Enable"
-          />
-        </EuiButton>
+        <EuiFlexGroup justifyContent="flexEnd" alignItems="center">
+          {!enablementOptions ? <EuiFlexItem>{proceedWarning}</EuiFlexItem> : null}
+          <EuiFlexItem grow={false}>
+            <EuiFlexGroup direction="row" justifyContent="flexEnd">
+              <EuiButtonEmpty onClick={() => toggle(false)}>{'Cancel'}</EuiButtonEmpty>
+              <EuiButton
+                onClick={enableStore(enablements)}
+                fill
+                isDisabled={!enablementOptions}
+                aria-disabled={!enablementOptions}
+              >
+                <FormattedMessage
+                  id="xpack.securitySolution.entityAnalytics.enablements.modal.enable"
+                  defaultMessage="Enable"
+                />
+              </EuiButton>
+            </EuiFlexGroup>
+          </EuiFlexItem>
+        </EuiFlexGroup>
       </EuiModalFooter>
     </EuiModal>
   );
diff --git a/x-pack/plugins/security_solution/public/entity_analytics/components/entity_store/translations.ts b/x-pack/plugins/security_solution/public/entity_analytics/components/entity_store/translations.ts
index 4c113dd533acb..f2920612543d9 100644
--- a/x-pack/plugins/security_solution/public/entity_analytics/components/entity_store/translations.ts
+++ b/x-pack/plugins/security_solution/public/entity_analytics/components/entity_store/translations.ts
@@ -62,3 +62,10 @@ export const ENABLEMENT_DESCRIPTION_BOTH = i18n.translate(
       'Your entity store is currently empty. Add information about your entities directly from your logs, or import them using a text file.',
   }
 );
+
+export const ENABLEMENT_WARNING_SELECT_TO_PROCEED = i18n.translate(
+  'xpack.securitySolution.entityAnalytics.entityStore.enablement.description.enablementWarningMessage',
+  {
+    defaultMessage: 'Please enable at least one option to proceed.',
+  }
+);

From 2501c18e1107c67c02c78a485ece9d4741124d10 Mon Sep 17 00:00:00 2001
From: CAWilson94 <charlotte.wilson@elastic.co>
Date: Tue, 19 Nov 2024 10:19:05 +0000
Subject: [PATCH 2/3] Remove entity mock hook not used

---
 .../components/enablement_modal.test.tsx          | 15 ---------------
 1 file changed, 15 deletions(-)

diff --git a/x-pack/plugins/security_solution/public/entity_analytics/components/entity_store/components/enablement_modal.test.tsx b/x-pack/plugins/security_solution/public/entity_analytics/components/entity_store/components/enablement_modal.test.tsx
index 360e28ec41518..bc41b1d38ecae 100644
--- a/x-pack/plugins/security_solution/public/entity_analytics/components/entity_store/components/enablement_modal.test.tsx
+++ b/x-pack/plugins/security_solution/public/entity_analytics/components/entity_store/components/enablement_modal.test.tsx
@@ -8,14 +8,10 @@
 import React from 'react';
 import { fireEvent, render, screen } from '@testing-library/react';
 import { EntityStoreEnablementModal } from './enablement_modal';
-import { useEntityEnginePrivileges } from '../hooks/use_entity_engine_privileges';
 import { TestProviders } from '../../../../common/mock';
 
 const mockToggle = jest.fn();
 const mockEnableStore = jest.fn(() => jest.fn());
-jest.mock('../hooks/use_entity_engine_privileges', () => ({
-  useEntityEnginePrivileges: jest.fn(),
-}));
 
 const defaultProps = {
   visible: true,
@@ -32,17 +28,6 @@ const renderComponent = (props = defaultProps) => {
 describe('EntityStoreEnablementModal', () => {
   beforeEach(() => {
     jest.clearAllMocks();
-    (useEntityEnginePrivileges as jest.Mock).mockReturnValue({
-      data: {
-        privileges: {
-          elasticsearch: {
-            index: {},
-          },
-          kibana: {},
-        },
-      },
-      isLoading: false,
-    });
   });
 
   it('should render the modal when visible is true', () => {

From e02ae0d35ea58638c32abc3050f4c79cf53d73f2 Mon Sep 17 00:00:00 2001
From: CAWilson94 <charlotte.wilson@elastic.co>
Date: Tue, 19 Nov 2024 10:49:28 +0000
Subject: [PATCH 3/3] merge conflicts

---
 .../entity_store/components/enablement_modal.tsx           | 7 -------
 1 file changed, 7 deletions(-)

diff --git a/x-pack/plugins/security_solution/public/entity_analytics/components/entity_store/components/enablement_modal.tsx b/x-pack/plugins/security_solution/public/entity_analytics/components/entity_store/components/enablement_modal.tsx
index 6f44cb1ed67bb..043925f5e5778 100644
--- a/x-pack/plugins/security_solution/public/entity_analytics/components/entity_store/components/enablement_modal.tsx
+++ b/x-pack/plugins/security_solution/public/entity_analytics/components/entity_store/components/enablement_modal.tsx
@@ -66,21 +66,15 @@ export const EntityStoreEnablementModal: React.FC<EntityStoreEnablementModalProp
     riskScore: !!riskScore.checked,
     entityStore: !!entityStore.checked,
   });
-<<<<<<< HEAD
   const riskEnginePrivileges = useMissingRiskEnginePrivileges();
-=======
-  const { data: privileges, isLoading: isLoadingPrivileges } = useEntityEnginePrivileges();
   const enablementOptions = enablements.riskScore || enablements.entityStore;
->>>>>>> 5d0b62ce9eb (Confirmation Modal - show warning message when nothing has been changed in modal.  (#199523))
 
   if (!visible) {
     return null;
   }
-<<<<<<< HEAD
   const hasRiskEnginePrivileges =
     !riskEnginePrivileges.isLoading && riskEnginePrivileges?.hasAllRequiredPrivileges;
 
-=======
   const proceedWarning = (
     <EuiCallOut
       size="s"
@@ -92,7 +86,6 @@ export const EntityStoreEnablementModal: React.FC<EntityStoreEnablementModalProp
       <p>{ENABLEMENT_WARNING_SELECT_TO_PROCEED}</p>
     </EuiCallOut>
   );
->>>>>>> 5d0b62ce9eb (Confirmation Modal - show warning message when nothing has been changed in modal.  (#199523))
   return (
     <EuiModal onClose={() => toggle(false)}>
       <EuiModalHeader>