fix: handle the undefined case correctly (#142580)

x-pack/plugins/security_solution/public/common/components/event_details/insights/related_alerts_by_process_ancestry.test.tsx

@@ -116,7 +116,7 @@ describe('RelatedAlertsByProcessAncestry', () => {
     });
   });
 
-  it('renders a special message when there are no alerts to display', async () => {
+  it('renders a special message when there are no alerts to display (empty response)', async () => {
     mockUseAlertPrevalenceFromProcessTree.mockReturnValue({
       loading: false,
       error: false,
@@ -134,4 +134,23 @@ describe('RelatedAlertsByProcessAncestry', () => {
       expect(screen.getByText(PROCESS_ANCESTRY_EMPTY)).toBeInTheDocument();
     });
   });
+
+  it('renders a special message when there are no alerts to display (undefined case)', async () => {
+    mockUseAlertPrevalenceFromProcessTree.mockReturnValue({
+      loading: false,
+      error: false,
+      alertIds: undefined,
+    });
+
+    render(
+      <TestProviders>
+        <RelatedAlertsByProcessAncestry {...props} />
+      </TestProviders>
+    );
+
+    userEvent.click(screen.getByText(PROCESS_ANCESTRY));
+    await waitFor(() => {
+      expect(screen.getByText(PROCESS_ANCESTRY_EMPTY)).toBeInTheDocument();
+    });
+  });
 });

x-pack/plugins/security_solution/public/common/components/event_details/insights/related_alerts_by_process_ancestry.tsx

@@ -70,15 +70,12 @@ export const RelatedAlertsByProcessAncestry = React.memo<Props>(
     const [cache, setCache] = useState<Partial<Cache>>({});
 
     const onToggle = useCallback((isOpen: boolean) => setShowContent(isOpen), []);
-    const isEmpty = !!cache.alertIds && cache.alertIds.length === 0;
 
     // Makes sure the component is not fetching data before the accordion
     // has been openend.
     const renderContent = useCallback(() => {
       if (!showContent) {
         return null;
-      } else if (isEmpty) {
-        return PROCESS_ANCESTRY_EMPTY;
       } else if (cache.alertIds) {
         return (
           <ActualRelatedAlertsByProcessAncestry
@@ -98,7 +95,7 @@ export const RelatedAlertsByProcessAncestry = React.memo<Props>(
           onCacheLoad={setCache}
         />
       );
-    }, [showContent, cache, data, eventId, timelineId, index, originalDocumentId, isEmpty]);
+    }, [showContent, cache, data, eventId, timelineId, index, originalDocumentId]);
 
     return (
       <InsightAccordion
@@ -143,7 +140,7 @@ const FetchAndNotifyCachedAlertsByProcessAncestry: React.FC<{
   });
 
   useEffect(() => {
-    if (alertIds) {
+    if (alertIds && alertIds.length !== 0) {
       onCacheLoad({ alertIds });
     }
   }, [alertIds, onCacheLoad]);
@@ -152,6 +149,8 @@ const FetchAndNotifyCachedAlertsByProcessAncestry: React.FC<{
     return <EuiLoadingSpinner />;
   } else if (error) {
     return <>{PROCESS_ANCESTRY_ERROR}</>;
+  } else if (!alertIds || alertIds.length === 0) {
+    return <>{PROCESS_ANCESTRY_EMPTY}</>;
   }
 
   return null;

x-pack/plugins/security_solution/public/common/containers/alerts/use_alert_prevalence_from_process_tree.ts

@@ -18,7 +18,7 @@ interface UserAlertPrevalenceFromProcessTreeResult {
 }
 
 interface ProcessTreeAlertPrevalenceResponse {
-  alertIds: string[];
+  alertIds: string[] | undefined;
 }
 
 interface EntityResponse {