pr comments

x-pack/plugins/security_solution/public/detections/components/alerts_kpis/alerts_by_rule_panel/alerts_by_rule.tsx

@@ -34,7 +34,7 @@ const COLUMNS: Array<EuiBasicTableColumn<AlertsByRuleData>> = [
   {
     field: 'rule',
     name: ALERTS_HEADERS_RULE_NAME,
-    'data-test-subj': 'detectionsTable-rule',
+    'data-test-subj': 'alert-by-rule-table-rule-name',
     truncateText: true,
     render: (rule: string) => (
       <EuiText size="xs" className="eui-textTruncate">
@@ -57,7 +57,7 @@ const COLUMNS: Array<EuiBasicTableColumn<AlertsByRuleData>> = [
     name: COUNT_TABLE_TITLE,
     dataType: 'number',
     sortable: true,
-    'data-test-subj': 'detectionsTable-count',
+    'data-test-subj': 'alert-by-rule-table-count',
     render: (count: number) => (
       <EuiText grow={false} size="xs">
         <FormattedCount count={count} />
@@ -67,19 +67,19 @@ const COLUMNS: Array<EuiBasicTableColumn<AlertsByRuleData>> = [
   },
 ];
 
-export const AlertsByRule: React.FC<AlertsByRuleProps> = ({ data, isLoading }) => {
-  const sorting: { sort: { field: keyof AlertsByRuleData; direction: SortOrder } } = {
-    sort: {
-      field: 'value',
-      direction: 'desc',
-    },
-  };
+const SORTING: { sort: { field: keyof AlertsByRuleData; direction: SortOrder } } = {
+  sort: {
+    field: 'value',
+    direction: 'desc',
+  },
+};
 
-  const pagination: {} = {
-    pageSize: 25,
-    showPerPageOptions: false,
-  };
+const PAGINATION: {} = {
+  pageSize: 25,
+  showPerPageOptions: false,
+};
 
+export const AlertsByRule: React.FC<AlertsByRuleProps> = ({ data, isLoading }) => {
   return (
     <Wrapper data-test-subj="alerts-by-rule">
       <EuiSpacer size="xs" />
@@ -89,8 +89,8 @@ export const AlertsByRule: React.FC<AlertsByRuleProps> = ({ data, isLoading }) =
           columns={COLUMNS}
           items={data}
           loading={isLoading}
-          sorting={sorting}
-          pagination={pagination}
+          sorting={SORTING}
+          pagination={PAGINATION}
         />
       </TableWrapper>
     </Wrapper>

x-pack/plugins/security_solution/public/detections/components/alerts_kpis/alerts_by_rule_panel/helpers.test.tsx

@@ -4,7 +4,7 @@
  * 2.0; you may not use this file except in compliance with the Elastic License
  * 2.0.
  */
-import { parseAlertsRuleData } from './helpers';
+import { parseAlertsRuleData, getIsAlertsByRuleData, getIsAlertsByRuleAgg } from './helpers';
 import * as mockRule from './mock_rule_data';
 import type { AlertsByRuleAgg } from './types';
 import type { AlertSearchResponse } from '../../../containers/detection_engine/alerts/types';
@@ -24,3 +24,27 @@ describe('parse alerts by rule data', () => {
     expect(res).toEqual([]);
   });
 });
+
+describe('get is alerts by rule data', () => {
+  test('should return true for rule data', () => {
+    expect(getIsAlertsByRuleData(mockRule.parsedAlerts)).toBe(true);
+  });
+
+  test('should return false for non rule data', () => {
+    expect(getIsAlertsByRuleData([{ key: 'low', value: 1 }])).toBe(false);
+  });
+
+  test('should return false for empty array', () => {
+    expect(getIsAlertsByRuleData([])).toBe(false);
+  });
+});
+
+describe('get is alerts by rule agg', () => {
+  test('return true for rule aggregation query', () => {
+    expect(getIsAlertsByRuleAgg(mockRule.mockAlertsData)).toBe(true);
+  });
+
+  test('return false for queries without alertByRule key', () => {
+    expect(getIsAlertsByRuleAgg({ ...mockRule.mockAlertsEmptyData, aggregations: {} })).toBe(false);
+  });
+});

x-pack/plugins/security_solution/public/detections/components/alerts_kpis/alerts_by_rule_panel/helpers.tsx

@@ -25,7 +25,7 @@ export const parseAlertsRuleData = (
 };
 
 export const getIsAlertsByRuleData = (data: SummaryChartsData[]): data is AlertsByRuleData[] => {
-  return data?.every((x) => has(x, 'rule'));
+  return data.length > 0 && data.every((x) => has(x, 'rule'));
 };
 
 export const getIsAlertsByRuleAgg = (