Fix bug where user can't add an exception when "close alert" is check…

…ed (elastic#72919) Co-authored-by: Elastic Machine <[email protected]>
peluja1012 · Jul 23, 2020 · cf771eb · cf771eb
1 parent 7aa8565
commit cf771eb
Show file tree

Hide file tree

Showing 2 changed files with 19 additions and 5 deletions.
diff --git a/.../plugins/security_solution/public/common/components/exceptions/use_add_exception.test.tsx b/.../plugins/security_solution/public/common/components/exceptions/use_add_exception.test.tsx
@@ -144,7 +144,7 @@ describe('useAddOrUpdateException', () => {
     await act(async () => {
       const { result, waitForNextUpdate } = render();
       await waitForNextUpdate();
-      expect(result.current).toEqual([{ isLoading: false }, null]);
+      expect(result.current).toEqual([{ isLoading: false }, result.current[1]]);
     });
   });
 

diff --git a/x-pack/plugins/security_solution/public/common/components/exceptions/use_add_exception.tsx b/x-pack/plugins/security_solution/public/common/components/exceptions/use_add_exception.tsx
@@ -4,7 +4,7 @@
  * you may not use this file except in compliance with the Elastic License.
  */
 
-import { useEffect, useRef, useState } from 'react';
+import { useEffect, useRef, useState, useCallback } from 'react';
 import { HttpStart } from '../../../../../../../src/core/public';
 
 import {
@@ -60,7 +60,19 @@ export const useAddOrUpdateException = ({
   onSuccess,
 }: UseAddOrUpdateExceptionProps): ReturnUseAddOrUpdateException => {
   const [isLoading, setIsLoading] = useState(false);
-  const addOrUpdateException = useRef<AddOrUpdateExceptionItemsFunc | null>(null);
+  const addOrUpdateExceptionRef = useRef<AddOrUpdateExceptionItemsFunc | null>(null);
+  const addOrUpdateException = useCallback<AddOrUpdateExceptionItemsFunc>(
+    async (exceptionItemsToAddOrUpdate, alertIdToClose, bulkCloseIndex) => {
+      if (addOrUpdateExceptionRef.current !== null) {
+        addOrUpdateExceptionRef.current(
+          exceptionItemsToAddOrUpdate,
+          alertIdToClose,
+          bulkCloseIndex
+        );
+      }
+    },
+    []
+  );
 
   useEffect(() => {
     let isSubscribed = true;
@@ -114,6 +126,7 @@ export const useAddOrUpdateException = ({
           await updateAlertStatus({
             query: getUpdateAlertsQuery([alertIdToClose]),
             status: 'closed',
+            signal: abortCtrl.signal,
           });
         }
 
@@ -131,6 +144,7 @@ export const useAddOrUpdateException = ({
               query: filter,
             },
             status: 'closed',
+            signal: abortCtrl.signal,
           });
         }
 
@@ -148,12 +162,12 @@ export const useAddOrUpdateException = ({
       }
     };
 
-    addOrUpdateException.current = addOrUpdateExceptionItems;
+    addOrUpdateExceptionRef.current = addOrUpdateExceptionItems;
     return (): void => {
       isSubscribed = false;
       abortCtrl.abort();
     };
   }, [http, onSuccess, onError]);
 
-  return [{ isLoading }, addOrUpdateException.current];
+  return [{ isLoading }, addOrUpdateException];
 };