[ML] Fix useEffects.

elastic · Aug 26, 2021 · cd871b2 · cd871b2
1 parent 34e882c
commit cd871b2
Show file tree

Hide file tree

Showing 7 changed files with 19 additions and 53 deletions.
diff --git a/x-pack/plugins/apm/public/components/app/correlations/failed_transactions_correlations.tsx b/x-pack/plugins/apm/public/components/app/correlations/failed_transactions_correlations.tsx
@@ -102,20 +102,9 @@ export function FailedTransactionsCorrelations({
     end,
   ]);
 
-  // start fetching on load and on changing environment
   useEffect(() => {
-    if (isRunning) {
-      cancelFetch();
-    }
-
     startFetchHandler();
-
-    return () => {
-      // cancel any running async partial request when unmounting the component
-      cancelFetch();
-    };
-    // `isRunning` must not be part of the deps check
-    // eslint-disable-next-line react-hooks/exhaustive-deps
+    return cancelFetch;
   }, [cancelFetch, startFetchHandler]);
 
   const [

diff --git a/x-pack/plugins/apm/public/components/app/correlations/latency_correlations.tsx b/x-pack/plugins/apm/public/components/app/correlations/latency_correlations.tsx
@@ -106,20 +106,9 @@ export function LatencyCorrelations({ onFilter }: { onFilter: () => void }) {
     end,
   ]);
 
-  // start fetching on load and on changing environment
   useEffect(() => {
-    if (isRunning) {
-      cancelFetch();
-    }
-
     startFetchHandler();
-
-    return () => {
-      // cancel any running async partial request when unmounting the component
-      cancelFetch();
-    };
-    // `isRunning` must not be part of the deps check
-    // eslint-disable-next-line react-hooks/exhaustive-deps
+    return cancelFetch;
   }, [cancelFetch, startFetchHandler]);
 
   useEffect(() => {

diff --git a/x-pack/plugins/apm/public/components/app/transaction_details/distribution/index.tsx b/x-pack/plugins/apm/public/components/app/transaction_details/distribution/index.tsx
@@ -108,7 +108,6 @@ export function TransactionDistribution({
   const {
     error,
     percentileThresholdValue,
-    isRunning,
     startFetch,
     cancelFetch,
     transactionDistribution,
@@ -136,20 +135,9 @@ export function TransactionDistribution({
     end,
   ]);
 
-  // start fetching on load and on changing environment
   useEffect(() => {
-    if (isRunning) {
-      cancelFetch();
-    }
-
     startFetchHandler();
-
-    return () => {
-      // cancel any running async partial request when unmounting the component
-      cancelFetch();
-    };
-    // `isRunning` must not be part of the deps check
-    // eslint-disable-next-line react-hooks/exhaustive-deps
+    return cancelFetch;
   }, [cancelFetch, startFetchHandler]);
 
   useEffect(() => {

diff --git a/x-pack/plugins/apm/public/components/shared/charts/transaction_distribution_chart/index.tsx b/x-pack/plugins/apm/public/components/shared/charts/transaction_distribution_chart/index.tsx
@@ -176,7 +176,7 @@ export function TransactionDistributionChart({
   );
 
   useEffect(() => {
-    if (typeof onHasData === 'function') {
+    if (onHasData) {
       onHasData(chartLoadingState.hasData);
     }
   }, [chartLoadingState, onHasData]);

diff --git a/x-pack/plugins/apm/public/hooks/use_failed_transactions_correlations_fetcher.ts b/x-pack/plugins/apm/public/hooks/use_failed_transactions_correlations_fetcher.ts
@@ -106,20 +106,20 @@ export const useFailedTransactionsCorrelationsFetcher = () => {
               setFetchState((prevState) => ({
                 ...prevState,
                 error: (res as unknown) as Error,
-                setIsRunning: false,
+                isRunning: false,
               }));
             }
           },
           error: (error: Error) => {
             setFetchState((prevState) => ({
               ...prevState,
               error,
-              setIsRunning: false,
+              isRunning: false,
             }));
           },
         });
     },
-    [data.search]
+    [data.search, setFetchState]
   );
 
   const cancelFetch = useCallback(() => {
@@ -128,9 +128,9 @@ export const useFailedTransactionsCorrelationsFetcher = () => {
     abortCtrl.current.abort();
     setFetchState((prevState) => ({
       ...prevState,
-      setIsRunning: false,
+      isRunning: false,
     }));
-  }, []);
+  }, [setFetchState]);
 
   return {
     ...fetchState,

diff --git a/x-pack/plugins/apm/public/hooks/use_transaction_distribution_fetcher.ts b/x-pack/plugins/apm/public/hooks/use_transaction_distribution_fetcher.ts
@@ -125,20 +125,20 @@ export function useTransactionDistributionFetcher() {
               setFetchState((prevState) => ({
                 ...prevState,
                 error: (res as unknown) as Error,
-                setIsRunning: false,
+                isRunning: false,
               }));
             }
           },
           error: (error: Error) => {
             setFetchState((prevState) => ({
               ...prevState,
               error,
-              setIsRunning: false,
+              isRunning: false,
             }));
           },
         });
     },
-    [data.search]
+    [data.search, setFetchState]
   );
 
   const cancelFetch = useCallback(() => {
@@ -147,9 +147,9 @@ export function useTransactionDistributionFetcher() {
     abortCtrl.current.abort();
     setFetchState((prevState) => ({
       ...prevState,
-      setIsRunning: false,
+      isRunning: false,
     }));
-  }, []);
+  }, [setFetchState]);
 
   return {
     ...fetchState,

diff --git a/x-pack/plugins/apm/public/hooks/use_transaction_latency_correlations_fetcher.ts b/x-pack/plugins/apm/public/hooks/use_transaction_latency_correlations_fetcher.ts
@@ -127,20 +127,20 @@ export const useTransactionLatencyCorrelationsFetcher = () => {
               setFetchState((prevState) => ({
                 ...prevState,
                 error: (res as unknown) as Error,
-                setIsRunning: false,
+                isRunning: false,
               }));
             }
           },
           error: (error: Error) => {
             setFetchState((prevState) => ({
               ...prevState,
               error,
-              setIsRunning: false,
+              isRunning: false,
             }));
           },
         });
     },
-    [data.search]
+    [data.search, setFetchState]
   );
 
   const cancelFetch = useCallback(() => {
@@ -149,9 +149,9 @@ export const useTransactionLatencyCorrelationsFetcher = () => {
     abortCtrl.current.abort();
     setFetchState((prevState) => ({
       ...prevState,
-      setIsRunning: false,
+      isRunning: false,
     }));
-  }, []);
+  }, [setFetchState]);
 
   return {
     ...fetchState,