add unmount check

elastic · Aug 2, 2023 · d23ccc3 · d23ccc3
1 parent 8876f99
commit d23ccc3
Show file tree

Hide file tree

Showing 2 changed files with 28 additions and 0 deletions.
diff --git a/...ops/public/components/log_rate_analysis_results_table/log_rate_analysis_results_table.tsx b/...ops/public/components/log_rate_analysis_results_table/log_rate_analysis_results_table.tsx
@@ -336,6 +336,9 @@ export const LogRateAnalysisResultsTable: FC<LogRateAnalysisResultsTableProps> =
     };
   }, [pageIndex, pageSize, sortField, sortDirection, significantTerms]);
 
+  // If no row is hovered or pinned, fall back to set the first row
+  // into a hovered state to make the main document count chart
+  // show a comparison view by default.
   useEffect(() => {
     if (
       selectedSignificantTerm === null &&
@@ -346,6 +349,17 @@ export const LogRateAnalysisResultsTable: FC<LogRateAnalysisResultsTableProps> =
     }
   }, [selectedSignificantTerm, setSelectedSignificantTerm, pageOfItems, pinnedSignificantTerm]);
 
+  // When the analysis results table unmounts,
+  // make sure to reset any hovered or pinned rows.
+  useEffect(
+    () => () => {
+      setSelectedSignificantTerm(null);
+      setPinnedSignificantTerm(null);
+    },
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    []
+  );
+
   const getRowStyle = (significantTerm: SignificantTerm) => {
     if (
       pinnedSignificantTerm &&

diff --git a/...lic/components/log_rate_analysis_results_table/log_rate_analysis_results_table_groups.tsx b/...lic/components/log_rate_analysis_results_table/log_rate_analysis_results_table_groups.tsx
@@ -423,12 +423,26 @@ export const LogRateAnalysisResultsGroupsTable: FC<LogRateAnalysisResultsTablePr
     };
   }, [pageIndex, pageSize, sortField, sortDirection, groupTableItems]);
 
+  // If no row is hovered or pinned, fall back to set the first row
+  // into a hovered state to make the main document count chart
+  // show a comparison view by default.
   useEffect(() => {
     if (selectedGroup === null && pinnedGroup === null && pageOfItems.length > 0) {
       setSelectedGroup(pageOfItems[0]);
     }
   }, [selectedGroup, setSelectedGroup, pageOfItems, pinnedGroup]);
 
+  // When the analysis results table unmounts,
+  // make sure to reset any hovered or pinned rows.
+  useEffect(
+    () => () => {
+      setSelectedGroup(null);
+      setPinnedGroup(null);
+    },
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    []
+  );
+
   const getRowStyle = (group: GroupTableItem) => {
     if (pinnedGroup && pinnedGroup.id === group.id) {
       return {