Merge branch 'main' into no_error_on_empty_field_fetch

elastic · Mar 23, 2023 · c983b4a · c983b4a
2 parents 953e23b + 293dd26
commit c983b4a
Show file tree

Hide file tree

Showing 114 changed files with 35,007 additions and 882 deletions.
diff --git a/api_docs/kbn_securitysolution_grouping.devdocs.json b/api_docs/kbn_securitysolution_grouping.devdocs.json
@@ -27,7 +27,7 @@
         "label": "getGroupingQuery",
         "description": [],
         "signature": [
-          "({ additionalFilters, from, groupByFields, metricsAggregations, pageNumber, rootAggregations, runtimeMappings, size, sort, to, }: ",
+          "({ additionalFilters, from, groupByFields, statsAggregations, pageNumber, rootAggregations, runtimeMappings, size, sort, to, }: ",
           "GroupingQueryArgs",
           ") => ",
           "GroupingQuery"
@@ -41,7 +41,7 @@
             "id": "def-common.getGroupingQuery.$1",
             "type": "Object",
             "tags": [],
-            "label": "{\n  additionalFilters = [],\n  from,\n  groupByFields,\n  metricsAggregations,\n  pageNumber,\n  rootAggregations,\n  runtimeMappings,\n  size = DEFAULT_GROUP_BY_FIELD_SIZE,\n  sort,\n  to,\n}",
+            "label": "{\n  additionalFilters = [],\n  from,\n  groupByFields,\n  statsAggregations,\n  pageNumber,\n  rootAggregations,\n  runtimeMappings,\n  size = DEFAULT_GROUP_BY_FIELD_SIZE,\n  sort,\n  to,\n}",
             "description": [],
             "signature": [
               "GroupingQueryArgs"
@@ -133,7 +133,7 @@
         "label": "useGrouping",
         "description": [],
         "signature": [
-          "<T>({ defaultGroupingOptions, fields, groupingId, onGroupChangeCallback, tracker, }: GroupingArgs) => Grouping<T>"
+          "<T>({ defaultGroupingOptions, fields, groupingId, onGroupChange, tracker, }: GroupingArgs) => Grouping<T>"
         ],
         "path": "packages/kbn-securitysolution-grouping/src/hooks/use_grouping.tsx",
         "deprecated": false,
@@ -144,7 +144,7 @@
             "id": "def-common.useGrouping.$1",
             "type": "Object",
             "tags": [],
-            "label": "{\n  defaultGroupingOptions,\n  fields,\n  groupingId,\n  onGroupChangeCallback,\n  tracker,\n}",
+            "label": "{\n  defaultGroupingOptions,\n  fields,\n  groupingId,\n  onGroupChange,\n  tracker,\n}",
             "description": [],
             "signature": [
               "GroupingArgs"
@@ -326,4 +326,4 @@
     ],
     "objects": []
   }
-}
+}
diff --git a/package.json b/package.json
@@ -1289,9 +1289,9 @@
     "@types/yauzl": "^2.9.1",
     "@types/yazl": "^2.4.2",
     "@types/zen-observable": "^0.8.0",
-    "@typescript-eslint/eslint-plugin": "^5.20.0",
-    "@typescript-eslint/parser": "^5.20.0",
-    "@typescript-eslint/typescript-estree": "^5.20.0",
+    "@typescript-eslint/eslint-plugin": "^5.54.0",
+    "@typescript-eslint/parser": "^5.54.0",
+    "@typescript-eslint/typescript-estree": "^5.54.0",
     "@wojtekmaj/enzyme-adapter-react-17": "^0.6.7",
     "@yarnpkg/lockfile": "^1.1.0",
     "abab": "^2.0.4",

diff --git a/packages/kbn-eslint-plugin-telemetry/helpers/get_intent_from_node.ts b/packages/kbn-eslint-plugin-telemetry/helpers/get_intent_from_node.ts
@@ -80,7 +80,7 @@ export function getIntentFromNode(originalNode: TSESTree.JSXOpeningElement): str
           return '';
         }
 
-        const object: TSESTree.LeftHandSideExpression = callee.object;
+        const object: TSESTree.Expression = callee.object;
         const property: TSESTree.Expression | TSESTree.PrivateIdentifier = callee.property;
 
         if (!('name' in object) || !('name' in property)) {

diff --git a/packages/kbn-securitysolution-grouping/index.tsx b/packages/kbn-securitysolution-grouping/index.tsx
@@ -6,26 +6,14 @@
  * Side Public License, v 1.
  */
 
-import React from 'react';
-import {
-  GroupSelector,
-  GroupSelectorProps,
-  RawBucket,
-  getGroupingQuery,
-  isNoneGroup,
-  useGrouping,
-} from './src';
+import { RawBucket, StatRenderer, getGroupingQuery, isNoneGroup, useGrouping } from './src';
 import type {
   GroupOption,
   GroupingAggregation,
   GroupingFieldTotalAggregation,
   NamedAggregation,
 } from './src';
 
-export const getGroupSelector = (
-  props: GroupSelectorProps
-): React.ReactElement<GroupSelectorProps> => <GroupSelector {...props} />;
-
 export { getGroupingQuery, isNoneGroup, useGrouping };
 
 export type {
@@ -34,4 +22,5 @@ export type {
   GroupingFieldTotalAggregation,
   NamedAggregation,
   RawBucket,
+  StatRenderer,
 };
diff --git a/packages/kbn-securitysolution-grouping/src/components/accordion_panel/group_stats.test.tsx b/packages/kbn-securitysolution-grouping/src/components/accordion_panel/group_stats.test.tsx
@@ -12,32 +12,16 @@ import { GroupStats } from './group_stats';
 
 const onTakeActionsOpen = jest.fn();
 const testProps = {
-  badgeMetricStats: [
-    { title: "IP's:", value: 1 },
-    { title: 'Rules:', value: 2 },
-    { title: 'Alerts:', value: 2, width: 50, color: '#a83632' },
-  ],
-  bucket: {
-    key: '9nk5mo2fby',
-    doc_count: 2,
-    hostsCountAggregation: { value: 1 },
-    ruleTags: { doc_count_error_upper_bound: 0, sum_other_doc_count: 0, buckets: [] },
-    alertsCount: { value: 2 },
-    rulesCountAggregation: { value: 2 },
-    severitiesSubAggregation: {
-      doc_count_error_upper_bound: 0,
-      sum_other_doc_count: 0,
-      buckets: [{ key: 'low', doc_count: 2 }],
-    },
-    countSeveritySubAggregation: { value: 1 },
-    usersCountAggregation: { value: 1 },
-  },
+  bucketKey: '9nk5mo2fby',
   onTakeActionsOpen,
-  customMetricStats: [
+  statRenderers: [
     {
       title: 'Severity',
-      customStatRenderer: <p data-test-subj="customMetricStat" />,
+      renderer: <p data-test-subj="customMetricStat" />,
     },
+    { title: "IP's:", badge: { value: 1 } },
+    { title: 'Rules:', badge: { value: 2 } },
+    { title: 'Alerts:', badge: { value: 2, width: 50, color: '#a83632' } },
   ],
   takeActionItems: [
     <p data-test-subj="takeActionItem-1" key={1} />,
@@ -49,13 +33,16 @@ describe('Group stats', () => {
     jest.clearAllMocks();
   });
   it('renders each stat item', () => {
-    const { getByTestId } = render(<GroupStats {...testProps} />);
+    const { getByTestId, queryByTestId } = render(<GroupStats {...testProps} />);
     expect(getByTestId('group-stats')).toBeInTheDocument();
-    testProps.badgeMetricStats.forEach(({ title: stat }) => {
-      expect(getByTestId(`metric-${stat}`)).toBeInTheDocument();
-    });
-    testProps.customMetricStats.forEach(({ title: stat }) => {
-      expect(getByTestId(`customMetric-${stat}`)).toBeInTheDocument();
+    testProps.statRenderers.forEach(({ title: stat, renderer }) => {
+      if (renderer != null) {
+        expect(getByTestId(`customMetric-${stat}`)).toBeInTheDocument();
+        expect(queryByTestId(`metric-${stat}`)).not.toBeInTheDocument();
+      } else {
+        expect(getByTestId(`metric-${stat}`)).toBeInTheDocument();
+        expect(queryByTestId(`customMetric-${stat}`)).not.toBeInTheDocument();
+      }
     });
   });
   it('when onTakeActionsOpen is defined, call onTakeActionsOpen on popover click', () => {

diff --git a/packages/kbn-securitysolution-grouping/src/components/accordion_panel/group_stats.tsx b/packages/kbn-securitysolution-grouping/src/components/accordion_panel/group_stats.tsx
@@ -16,23 +16,20 @@ import {
   EuiToolTip,
 } from '@elastic/eui';
 import React, { useCallback, useMemo, useState } from 'react';
-import type { BadgeMetric, CustomMetric } from '.';
+import { StatRenderer } from '../types';
 import { statsContainerCss } from '../styles';
 import { TAKE_ACTION } from '../translations';
-import type { RawBucket } from '../types';
 
 interface GroupStatsProps<T> {
-  badgeMetricStats?: BadgeMetric[];
-  bucket: RawBucket<T>;
-  customMetricStats?: CustomMetric[];
+  bucketKey: string;
+  statRenderers?: StatRenderer[];
   onTakeActionsOpen?: () => void;
   takeActionItems: JSX.Element[];
 }
 
 const GroupStatsComponent = <T,>({
-  badgeMetricStats,
-  bucket,
-  customMetricStats,
+  bucketKey,
+  statRenderers,
   onTakeActionsOpen,
   takeActionItems,
 }: GroupStatsProps<T>) => {
@@ -43,42 +40,39 @@ const GroupStatsComponent = <T,>({
     [isPopoverOpen, onTakeActionsOpen]
   );
 
-  const badgesComponents = useMemo(
+  const statsComponent = useMemo(
     () =>
-      badgeMetricStats?.map((metric) => (
-        <EuiFlexItem grow={false} key={metric.title}>
-          <span css={statsContainerCss} data-test-subj={`metric-${metric.title}`}>
-            <>
-              {metric.title}
-              <EuiToolTip position="top" content={metric.value}>
-                <EuiBadge
-                  style={{ marginLeft: 10, width: metric.width ?? 35 }}
-                  color={metric.color ?? 'hollow'}
-                >
-                  {metric.value > 99 ? '99+' : metric.value.toString()}
-                </EuiBadge>
-              </EuiToolTip>
-            </>
-          </span>
-        </EuiFlexItem>
-      )),
-    [badgeMetricStats]
-  );
+      statRenderers?.map((stat) => {
+        const { dataTestSubj, component } =
+          stat.badge != null
+            ? {
+                dataTestSubj: `metric-${stat.title}`,
+                component: (
+                  <EuiToolTip position="top" content={stat.badge.value}>
+                    <EuiBadge
+                      style={{ marginLeft: 10, width: stat.badge.width ?? 35 }}
+                      color={stat.badge.color ?? 'hollow'}
+                    >
+                      {stat.badge.value > 99 ? '99+' : stat.badge.value.toString()}
+                    </EuiBadge>
+                  </EuiToolTip>
+                ),
+              }
+            : { dataTestSubj: `customMetric-${stat.title}`, component: stat.renderer };
 
-  const customComponents = useMemo(
-    () =>
-      customMetricStats?.map((customMetric) => (
-        <EuiFlexItem grow={false} key={customMetric.title}>
-          <span css={statsContainerCss} data-test-subj={`customMetric-${customMetric.title}`}>
-            {customMetric.title}
-            {customMetric.customStatRenderer}
-          </span>
-        </EuiFlexItem>
-      )),
-    [customMetricStats]
+        return (
+          <EuiFlexItem grow={false} key={stat.title}>
+            <span css={statsContainerCss} data-test-subj={dataTestSubj}>
+              {stat.title}
+              {component}
+            </span>
+          </EuiFlexItem>
+        );
+      }),
+    [statRenderers]
   );
 
-  const popoverComponent = useMemo(
+  const takeActionMenu = useMemo(
     () => (
       <EuiFlexItem grow={false}>
         <EuiPopover
@@ -107,13 +101,12 @@ const GroupStatsComponent = <T,>({
   return (
     <EuiFlexGroup
       data-test-subj="group-stats"
-      key={`stats-${bucket.key[0]}`}
+      key={`stats-${bucketKey}`}
       gutterSize="none"
       alignItems="center"
     >
-      {customComponents}
-      {badgesComponents}
-      {popoverComponent}
+      {statsComponent}
+      {takeActionMenu}
     </EuiFlexGroup>
   );
 };

diff --git a/packages/kbn-securitysolution-grouping/src/components/accordion_panel/index.tsx b/packages/kbn-securitysolution-grouping/src/components/accordion_panel/index.tsx
@@ -13,18 +13,6 @@ import { firstNonNullValue } from '../../helpers';
 import type { RawBucket } from '../types';
 import { createGroupFilter } from './helpers';
 
-export interface BadgeMetric {
-  title: string;
-  value: number;
-  color?: string;
-  width?: number;
-}
-
-export interface CustomMetric {
-  title: string;
-  customStatRenderer: JSX.Element;
-}
-
 interface GroupPanelProps<T> {
   customAccordionButtonClassName?: string;
   customAccordionClassName?: string;
@@ -35,7 +23,7 @@ interface GroupPanelProps<T> {
   isLoading: boolean;
   level?: number;
   onToggleGroup?: (isOpen: boolean, groupBucket: RawBucket<T>) => void;
-  renderChildComponent: (groupFilter: Filter[]) => React.ReactNode;
+  renderChildComponent: (groupFilter: Filter[]) => React.ReactElement;
   selectedGroup: string;
 }