From 6ca92bdeabf85eae79c030a238a6749a715467ce Mon Sep 17 00:00:00 2001
From: Ben Waples <bwaples@specterops.io>
Date: Tue, 21 Nov 2023 12:59:33 -0800
Subject: [PATCH] Warning when disabling MFA (#232)

* add displayWarning prop and use it on admin side

* display alert

* add test and option prop

* update comment

* always display 2fa warning
---
 .../Disable2FADialog/Disable2FADialog.test.tsx    |  4 ++++
 .../Disable2FADialog/Disable2FADialog.tsx         | 15 ++++++++++++++-
 2 files changed, 18 insertions(+), 1 deletion(-)

diff --git a/packages/javascript/bh-shared-ui/src/components/Disable2FADialog/Disable2FADialog.test.tsx b/packages/javascript/bh-shared-ui/src/components/Disable2FADialog/Disable2FADialog.test.tsx
index cb1127498b..f26a01434f 100644
--- a/packages/javascript/bh-shared-ui/src/components/Disable2FADialog/Disable2FADialog.test.tsx
+++ b/packages/javascript/bh-shared-ui/src/components/Disable2FADialog/Disable2FADialog.test.tsx
@@ -92,6 +92,10 @@ describe('Enable2FADialog', () => {
         ).toBeInTheDocument();
     });
 
+    it('displays security warning ', () => {
+        expect(screen.queryByTestId('ReportProblemOutlinedIcon')).toBeInTheDocument();
+    });
+
     describe('user clicks "Cancel" button', () => {
         beforeEach(async () => {
             await user.click(screen.getByRole('button', { name: 'Cancel' }));
diff --git a/packages/javascript/bh-shared-ui/src/components/Disable2FADialog/Disable2FADialog.tsx b/packages/javascript/bh-shared-ui/src/components/Disable2FADialog/Disable2FADialog.tsx
index 1fc856663d..b2e9a18a1e 100644
--- a/packages/javascript/bh-shared-ui/src/components/Disable2FADialog/Disable2FADialog.tsx
+++ b/packages/javascript/bh-shared-ui/src/components/Disable2FADialog/Disable2FADialog.tsx
@@ -14,7 +14,16 @@
 //
 // SPDX-License-Identifier: Apache-2.0
 
-import { Button, Dialog, DialogActions, DialogContent, DialogContentText, DialogTitle, TextField } from '@mui/material';
+import {
+    Alert,
+    Button,
+    Dialog,
+    DialogActions,
+    DialogContent,
+    DialogContentText,
+    DialogTitle,
+    TextField,
+} from '@mui/material';
 import React from 'react';
 
 const Disable2FADialog: React.FC<{
@@ -37,6 +46,10 @@ const Disable2FADialog: React.FC<{
             <DialogTitle>Disable Multi-Factor Authentication?</DialogTitle>
             <form onSubmit={handleOnSave}>
                 <DialogContent>
+                    <Alert severity='warning' style={{ marginBottom: '10px', alignItems: 'center' }}>
+                        Disabling MFA increases the risk of unauthorized access. For optimal account security, we highly
+                        recommend keeping MFA enabled.
+                    </Alert>
                     <DialogContentText>{contentText}</DialogContentText>
 
                     <TextField