wrap passed in function with useCallback

angorayc · angorayc · commit 4eeb742ff7fa · 2019-11-15T15:10:51.000Z
diff --git a/x-pack/legacy/plugins/siem/public/pages/network/navigation/network_routes.tsx b/x-pack/legacy/plugins/siem/public/pages/network/navigation/network_routes.tsx
@@ -4,7 +4,7 @@
  * you may not use this file except in compliance with the Elastic License.
  */
 
-import React from 'react';
+import React, { useCallback } from 'react';
 import { Route, Switch } from 'react-router-dom';
 import { EuiFlexItem, EuiSpacer } from '@elastic/eui';
 
@@ -19,7 +19,7 @@ import { DnsQueryTabBody } from './dns_query_tab_body';
 import { ConditionalFlexGroup } from './conditional_flex_group';
 import { NetworkRoutesProps, NetworkRouteType } from './types';
 import { TlsQueryTabBody } from './tls_query_tab_body';
-import { Anomaly, NarrowDateRange } from '../../../components/ml/types';
+import { Anomaly } from '../../../components/ml/types';
 
 export const NetworkRoutes = ({
   networkPagePath,
@@ -32,17 +32,23 @@ export const NetworkRoutes = ({
   setQuery,
   setAbsoluteRangeDatePicker,
 }: NetworkRoutesProps) => {
-  const narrowDateRange: NarrowDateRange = (score: Anomaly, interval: string) => {
-    const fromTo = scoreIntervalToDateTime(score, interval);
-    setAbsoluteRangeDatePicker({
-      id: 'global',
-      from: fromTo.from,
-      to: fromTo.to,
-    });
-  };
-  const updateDateRange = (min: number, max: number) => {
-    setAbsoluteRangeDatePicker({ id: 'global', from: min, to: max });
-  };
+  const narrowDateRange = useCallback(
+    (score: Anomaly, interval: string) => {
+      const fromTo = scoreIntervalToDateTime(score, interval);
+      setAbsoluteRangeDatePicker({
+        id: 'global',
+        from: fromTo.from,
+        to: fromTo.to,
+      });
+    },
+    [scoreIntervalToDateTime, setAbsoluteRangeDatePicker]
+  );
+  const updateDateRange = useCallback(
+    (min: number, max: number) => {
+      setAbsoluteRangeDatePicker({ id: 'global', from: min, to: max });
+    },
+    [from, to]
+  );
 
   const tabProps = {
     networkPagePath,
