[Security Solution][RAC] Fixes updatedAt loading bug (#111010) (#111440)

Co-authored-by: Davis Plumlee <[email protected]>
elastic · Sep 7, 2021 · 673bcfd · 673bcfd
1 parent 2fa1822
commit 673bcfd
Show file tree

Hide file tree

Showing 2 changed files with 20 additions and 8 deletions.
diff --git a/...k/plugins/security_solution/public/detections/pages/detection_engine/detection_engine.tsx b/...k/plugins/security_solution/public/detections/pages/detection_engine/detection_engine.tsx
@@ -104,6 +104,9 @@ const DetectionEnginePageComponent: React.FC<DetectionEngineComponentProps> = ({
   const updatedAt = useShallowEqualSelector(
     (state) => (getTimeline(state, TimelineId.detectionsPage) ?? timelineDefaults).updated
   );
+  const isAlertsLoading = useShallowEqualSelector(
+    (state) => (getTimeline(state, TimelineId.detectionsPage) ?? timelineDefaults).isLoading
+  );
   const getGlobalFiltersQuerySelector = useMemo(
     () => inputsSelectors.globalFiltersQuerySelector(),
     []
@@ -144,6 +147,8 @@ const DetectionEnginePageComponent: React.FC<DetectionEngineComponentProps> = ({
   } = useKibana().services;
   const [filterGroup, setFilterGroup] = useState<Status>(FILTER_OPEN);
 
+  const showUpdating = useMemo(() => isAlertsLoading || loading, [isAlertsLoading, loading]);
+
   const updateDateRangeCallback = useCallback<UpdateDateRange>(
     ({ x }) => {
       if (!x) {
@@ -342,10 +347,11 @@ const DetectionEnginePageComponent: React.FC<DetectionEngineComponentProps> = ({
                   />
                 </EuiFlexItem>
                 <EuiFlexItem grow={false}>
-                  {timelinesUi.getLastUpdated({
-                    updatedAt: updatedAt || 0,
-                    showUpdating: loading,
-                  })}
+                  {updatedAt &&
+                    timelinesUi.getLastUpdated({
+                      updatedAt: updatedAt || Date.now(),
+                      showUpdating,
+                    })}
                 </EuiFlexItem>
               </EuiFlexGroup>
               <EuiSpacer size="m" />

diff --git a/...lugins/security_solution/public/detections/pages/detection_engine/rules/details/index.tsx b/...lugins/security_solution/public/detections/pages/detection_engine/rules/details/index.tsx
@@ -180,6 +180,9 @@ const RuleDetailsPageComponent: React.FC<DetectionEngineComponentProps> = ({
   const updatedAt = useShallowEqualSelector(
     (state) => (getTimeline(state, TimelineId.detectionsPage) ?? timelineDefaults).updated
   );
+  const isAlertsLoading = useShallowEqualSelector(
+    (state) => (getTimeline(state, TimelineId.detectionsPage) ?? timelineDefaults).isLoading
+  );
   const getGlobalFiltersQuerySelector = useMemo(
     () => inputsSelectors.globalFiltersQuerySelector(),
     []
@@ -285,6 +288,8 @@ const RuleDetailsPageComponent: React.FC<DetectionEngineComponentProps> = ({
     }
   }, [hasIndexRead]);
 
+  const showUpdating = useMemo(() => isAlertsLoading || loading, [isAlertsLoading, loading]);
+
   const title = useMemo(
     () => (
       <>
@@ -772,10 +777,11 @@ const RuleDetailsPageComponent: React.FC<DetectionEngineComponentProps> = ({
                     />
                   </EuiFlexItem>
                   <EuiFlexItem grow={false}>
-                    {timelinesUi.getLastUpdated({
-                      updatedAt: updatedAt || 0,
-                      showUpdating: loading,
-                    })}
+                    {updatedAt &&
+                      timelinesUi.getLastUpdated({
+                        updatedAt: updatedAt || Date.now(),
+                        showUpdating,
+                      })}
                   </EuiFlexItem>
                 </EuiFlexGroup>
                 <EuiSpacer size="l" />