fixup

elastic · Oct 14, 2020 · 732d88c · 732d88c
1 parent 772c6bb
commit 732d88c
Show file tree

Hide file tree

Showing 3 changed files with 34 additions and 26 deletions.
diff --git a/...rity_solution/public/detections/components/rules/pre_packaged_rules/load_empty_prompt.tsx b/...rity_solution/public/detections/components/rules/pre_packaged_rules/load_empty_prompt.tsx
@@ -5,7 +5,7 @@
  */
 
 import { EuiEmptyPrompt, EuiFlexGroup, EuiFlexItem } from '@elastic/eui';
-import React, { memo, useCallback } from 'react';
+import React, { memo, useCallback, useMemo } from 'react';
 import styled from 'styled-components';
 
 import { useHistory } from 'react-router-dom';
@@ -60,12 +60,16 @@ const PrePackagedRulesPromptComponent: React.FC<PrePackagedRulesPromptProps> = (
     hasEncryptionKey,
   });
 
-  const loadPrebuiltRulesAndTemplatesButton = getLoadPrebuiltRulesAndTemplatesButton({
-    isDisabled: userHasNoPermissions,
-    onClick: handlePreBuiltCreation,
-    fill: true,
-    testSubj: 'load-prebuilt-rules',
-  });
+  const loadPrebuiltRulesAndTemplatesButton = useMemo(
+    () =>
+      getLoadPrebuiltRulesAndTemplatesButton({
+        isDisabled: userHasNoPermissions,
+        onClick: handlePreBuiltCreation,
+        fill: true,
+        'data-test-subj': 'load-prebuilt-rules',
+      }),
+    [getLoadPrebuiltRulesAndTemplatesButton, handlePreBuiltCreation, userHasNoPermissions]
+  );
 
   return (
     <EmptyPrompt

diff --git a/...y_solution/public/detections/containers/detection_engine/rules/use_pre_packaged_rules.tsx b/...y_solution/public/detections/containers/detection_engine/rules/use_pre_packaged_rules.tsx
@@ -29,16 +29,11 @@ interface ReturnPrePackagedTimelines {
   timelinesNotUpdated: number | null;
 }
 
-type GetLoadPrebuiltRulesAndTemplatesButton = ({
-  isDisabled,
-  onClick,
-  fill,
-  testSubj,
-}: {
+type GetLoadPrebuiltRulesAndTemplatesButton = (args: {
   isDisabled: boolean;
   onClick: () => void;
   fill?: boolean;
-  testSubj?: string;
+  'data-test-subj'?: string;
 }) => React.ReactNode | null;
 
 type GetReloadPrebuiltRulesAndTemplatesButton = ({
@@ -281,7 +276,7 @@ export const usePrePackagedRules = ({
     ]
   );
   const getLoadPrebuiltRulesAndTemplatesButton = useCallback(
-    ({ isDisabled, onClick, fill, testSubj = 'loadPrebuiltRulesBtn' }) => {
+    ({ isDisabled, onClick, fill, 'data-test-subj': dataTestSubj = 'loadPrebuiltRulesBtn' }) => {
       return prePackagedRuleStatus === 'ruleNotInstalled' ||
         prePackagedTimelineStatus === 'timelinesNotInstalled' ? (
         <EuiButton
@@ -290,7 +285,7 @@ export const usePrePackagedRules = ({
           isLoading={loadingCreatePrePackagedRules}
           isDisabled={isDisabled}
           onClick={onClick}
-          data-test-subj={testSubj}
+          data-test-subj={dataTestSubj}
         >
           {prePackagedRuleStatus === 'ruleNotInstalled' &&
             prePackagedTimelineStatus === 'timelinesNotInstalled' &&

diff --git a/x-pack/plugins/security_solution/public/detections/pages/detection_engine/rules/index.tsx b/x-pack/plugins/security_solution/public/detections/pages/detection_engine/rules/index.tsx
@@ -5,7 +5,7 @@
  */
 
 import { EuiButton, EuiFlexGroup, EuiFlexItem, EuiToolTip } from '@elastic/eui';
-import React, { useCallback, useRef, useState } from 'react';
+import React, { useCallback, useMemo, useRef, useState } from 'react';
 import { useHistory } from 'react-router-dom';
 
 import { usePrePackagedRules, importRules } from '../../../containers/detection_engine/rules';
@@ -123,6 +123,24 @@ const RulesPageComponent: React.FC = () => {
     [history]
   );
 
+  const loadPrebuiltRulesAndTemplatesButton = useMemo(
+    () =>
+      getLoadPrebuiltRulesAndTemplatesButton({
+        isDisabled: userHasNoPermissions(canUserCRUD) || loading,
+        onClick: handleCreatePrePackagedRules,
+      }),
+    [canUserCRUD, getLoadPrebuiltRulesAndTemplatesButton, handleCreatePrePackagedRules, loading]
+  );
+
+  const reloadPrebuiltRulesAndTemplatesButton = useMemo(
+    () =>
+      getReloadPrebuiltRulesAndTemplatesButton({
+        isDisabled: userHasNoPermissions(canUserCRUD) || loading,
+        onClick: handleCreatePrePackagedRules,
+      }),
+    [canUserCRUD, getReloadPrebuiltRulesAndTemplatesButton, handleCreatePrePackagedRules, loading]
+  );
+
   if (
     redirectToDetections(
       isSignalIndexExists,
@@ -135,15 +153,6 @@ const RulesPageComponent: React.FC = () => {
     return null;
   }
 
-  const loadPrebuiltRulesAndTemplatesButton = getLoadPrebuiltRulesAndTemplatesButton({
-    isDisabled: userHasNoPermissions(canUserCRUD) || loading,
-    onClick: handleCreatePrePackagedRules,
-  });
-
-  const reloadPrebuiltRulesAndTemplatesButton = getReloadPrebuiltRulesAndTemplatesButton({
-    isDisabled: userHasNoPermissions(canUserCRUD) || loading,
-    onClick: handleCreatePrePackagedRules,
-  });
   return (
     <>
       {userHasNoPermissions(canUserCRUD) && <ReadOnlyCallOut />}