From 8807f5277f23f51b1d5150ce87fd8e405535956d Mon Sep 17 00:00:00 2001
From: Ryland Herrick <ryalnd@gmail.com>
Date: Mon, 29 Jun 2020 18:37:56 -0500
Subject: [PATCH] Fix double callback post-import

After uploading a list, the modal was being shown twice. Declaring the
constituent state dependencies separately fixed the issue.
---
 .../components/value_lists_management_modal/form.tsx | 12 +++++-------
 1 file changed, 5 insertions(+), 7 deletions(-)

diff --git a/x-pack/plugins/security_solution/public/alerts/components/value_lists_management_modal/form.tsx b/x-pack/plugins/security_solution/public/alerts/components/value_lists_management_modal/form.tsx
index b76aec0b3aae1..1864675499a07 100644
--- a/x-pack/plugins/security_solution/public/alerts/components/value_lists_management_modal/form.tsx
+++ b/x-pack/plugins/security_solution/public/alerts/components/value_lists_management_modal/form.tsx
@@ -100,14 +100,12 @@ export const ValueListsFormComponent: React.FC<ValueListsFormProps> = ({ onError
   }, [importState.loading, files, importList, http, type]);
 
   useEffect(() => {
-    const { error, loading, result } = importState;
-
-    if (!loading && result) {
-      handleSuccess(result);
-    } else if (!loading && error) {
-      handleError(error);
+    if (!importState.loading && importState.result) {
+      handleSuccess(importState.result);
+    } else if (!importState.loading && importState.error) {
+      handleError(importState.error);
     }
-  }, [handleError, handleSuccess, importState]);
+  }, [handleError, handleSuccess, importState.error, importState.loading, importState.result]);
 
   useEffect(() => {
     return handleCancel;