pair programming with angela to get filter working

elastic · Dec 17, 2019 · f231c4e · f231c4e
1 parent 838c9bc
commit f231c4e
Show file tree

Hide file tree

Showing 6 changed files with 130 additions and 87 deletions.
diff --git a/x-pack/legacy/plugins/siem/public/components/alerts_viewer/alerts_table.tsx b/x-pack/legacy/plugins/siem/public/components/alerts_viewer/alerts_table.tsx
@@ -4,13 +4,12 @@
  * you may not use this file except in compliance with the Elastic License.
  */
 
-import React from 'react';
+import React, { useMemo } from 'react';
 
-import { esFilters } from 'src/plugins/data/common/es_query';
+import { esFilters } from '../../../../../../../src/plugins/data/common/es_query';
 import { StatefulEventsViewer } from '../events_viewer';
 import * as i18n from './translations';
 import { alertsDefaultModel } from './default_headers';
-import { AlertsComponentPageFilterDsl } from './types';
 
 export interface OwnProps {
   end: number;
@@ -19,38 +18,36 @@ export interface OwnProps {
 }
 
 const ALERTS_TABLE_ID = 'timeline-alerts-table';
-const filter: esFilters.Filter[] = [
-  {
-    meta: {
-      alias: null,
-      negate: false,
-      disabled: false,
-      type: 'phrase',
-      key: 'event.kind',
-      params: {
-        query: 'alert',
-      },
+const filter: esFilters.Filter = {
+  meta: {
+    alias: null,
+    negate: false,
+    disabled: false,
+    type: 'phrase',
+    key: 'event.kind',
+    params: {
+      query: 'alert',
     },
-    query: {
-      bool: {
-        filter: [
-          {
-            bool: {
-              should: [
-                {
-                  match: {
-                    'event.kind': 'alert',
-                  },
+  },
+  query: {
+    bool: {
+      filter: [
+        {
+          bool: {
+            should: [
+              {
+                match: {
+                  'event.kind': 'alert',
                 },
-              ],
-              minimum_should_match: 1,
-            },
+              },
+            ],
+            minimum_should_match: 1,
           },
-        ],
-      },
+        },
+      ],
     },
   },
-];
+};
 
 export const AlertsTable = React.memo(
   ({
@@ -60,20 +57,12 @@ export const AlertsTable = React.memo(
   }: {
     endDate: number;
     startDate: number;
-    pageFilters: AlertsComponentPageFilterDsl;
+    pageFilters: esFilters.Filter;
   }) => {
+    const alertsFilter = useMemo(() => [filter, pageFilters], [filter, pageFilters]);
     return (
       <StatefulEventsViewer
-        pageFilters={[
-          {
-            meta: { ...filter[0].meta },
-            query: {
-              bool: {
-                filter: [...filter[0].query.bool.filter, ...pageFilters],
-              },
-            },
-          },
-        ]}
+        pageFilters={alertsFilter}
         defaultModel={alertsDefaultModel}
         end={endDate}
         id={ALERTS_TABLE_ID}

diff --git a/x-pack/legacy/plugins/siem/public/components/alerts_viewer/index.tsx b/x-pack/legacy/plugins/siem/public/components/alerts_viewer/index.tsx
@@ -4,12 +4,13 @@
  * you may not use this file except in compliance with the Elastic License.
  */
 
+import { noop } from 'lodash/fp';
 import React from 'react';
 
 import { EuiSpacer } from '@elastic/eui';
 import { manageQuery } from '../page/manage_query';
 import { AlertsOverTimeHistogram } from '../page/hosts/alerts_over_time';
-import { AlertsComponentsQueryProps, AlertsComponentPageFilterDsl } from './types';
+import { AlertsComponentsQueryProps } from './types';
 import { AlertsOverTimeQuery } from '../../containers/alerts/alerts_over_time';
 import { hostsModel } from '../../store/model';
 import { AlertsTable } from './alerts_table';
@@ -24,8 +25,8 @@ export const AlertsView = ({
   setQuery,
   startDate,
   type,
-  updateDateRange = () => {},
-}: AlertsComponentsQueryProps & { pageFilters: AlertsComponentPageFilterDsl }) => (
+  updateDateRange = noop,
+}: AlertsComponentsQueryProps) => (
   <>
     <AlertsOverTimeQuery
       endDate={endDate}

diff --git a/x-pack/legacy/plugins/siem/public/components/alerts_viewer/types.ts b/x-pack/legacy/plugins/siem/public/components/alerts_viewer/types.ts
@@ -4,20 +4,22 @@
  * you may not use this file except in compliance with the Elastic License.
  */
 
+import { esFilters } from '../../../../../../../src/plugins/data/common';
 import { HostsComponentsQueryProps } from '../../pages/hosts/navigation/types';
 import { NetworkComponentQueryProps } from '../../pages/network/navigation/types';
 
-export interface PageFilterDsl {
-  exists: {
-    field: string;
-  };
+type CommonQueryProps = HostsComponentsQueryProps | NetworkComponentQueryProps;
+export interface AlertsComponentsQueryProps
+  extends Pick<
+    CommonQueryProps,
+    | 'deleteQuery'
+    | 'endDate'
+    | 'filterQuery'
+    | 'skip'
+    | 'setQuery'
+    | 'startDate'
+    | 'type'
+    | 'updateDateRange'
+  > {
+  pageFilters: esFilters.Filter;
 }
-
-export type AlertsComponentPageFilterDsl = Array<{
-  bool: {
-    should: PageFilterDsl[];
-    minimum_should_match: number;
-  };
-}>;
-
-export type AlertsComponentsQueryProps = HostsComponentsQueryProps | NetworkComponentQueryProps;
diff --git a/x-pack/legacy/plugins/siem/public/pages/network/navigation/alerts_query_tab_body.tsx b/x-pack/legacy/plugins/siem/public/pages/network/navigation/alerts_query_tab_body.tsx
@@ -5,39 +5,62 @@
  */
 
 import React from 'react';
+
+import { esFilters } from '../../../../../../../../src/plugins/data/common/es_query';
 import { AlertsView } from '../../../components/alerts_viewer';
 import { NetworkComponentQueryProps } from './types';
 
-export const NetworkAlertsQueryTabBody = React.memo((alertsProps: NetworkComponentQueryProps) => (
-  <AlertsView
-    {...alertsProps}
-    pageFilters={[
-      {
-        bool: {
-          should: [
-            {
-              exists: {
-                field: 'source.ip',
+export const filterAlertsNetwork: esFilters.Filter = {
+  query: {
+    bool: {
+      filter: [
+        {
+          bool: {
+            should: [
+              {
+                bool: {
+                  should: [
+                    {
+                      exists: {
+                        field: 'source.ip',
+                      },
+                    },
+                  ],
+                  minimum_should_match: 1,
+                },
               },
-            },
-          ],
-          minimum_should_match: 1,
-        },
-      },
-      {
-        bool: {
-          should: [
-            {
-              exists: {
-                field: 'destination.ip',
+              {
+                bool: {
+                  should: [
+                    {
+                      exists: {
+                        field: 'destination.ip',
+                      },
+                    },
+                  ],
+                  minimum_should_match: 1,
+                },
               },
-            },
-          ],
-          minimum_should_match: 1,
+            ],
+            minimum_should_match: 1,
+          },
         },
-      },
-    ]}
-  />
+      ],
+    },
+  },
+  meta: {
+    alias: '',
+    disabled: false,
+    key: 'bool',
+    negate: false,
+    type: 'custom',
+    value:
+      '{"bool":{"filter":[{"bool":{"should":[{"bool":{"should":[{"exists":{"field": "source.ip"}}],"minimum_should_match":1}},{"bool":{"should":[{"exists":{"field": "destination.ip"}}],"minimum_should_match":1}}],"minimum_should_match":1}}]}}',
+  },
+};
+
+export const NetworkAlertsQueryTabBody = React.memo((alertsProps: NetworkComponentQueryProps) => (
+  <AlertsView {...alertsProps} pageFilters={filterAlertsNetwork} />
 ));
 
 NetworkAlertsQueryTabBody.displayName = 'NetworkAlertsQueryTabBody';
diff --git a/x-pack/legacy/plugins/siem/public/pages/network/network.tsx b/x-pack/legacy/plugins/siem/public/pages/network/network.tsx
@@ -5,10 +5,12 @@
  */
 
 import { EuiSpacer } from '@elastic/eui';
-import React from 'react';
+import React, { useMemo } from 'react';
 import { connect } from 'react-redux';
+import { useParams } from 'react-router-dom';
 import { StickyContainer } from 'react-sticky';
 
+import { esQuery } from '../../../../../../../src/plugins/data/public';
 import { EmbeddedMap } from '../../components/embeddables/embedded_map';
 import { FiltersGlobal } from '../../components/filters_global';
 import { HeaderPage } from '../../components/header_page';
@@ -27,10 +29,10 @@ import { networkModel, State, inputsSelectors } from '../../store';
 import { setAbsoluteRangeDatePicker as dispatchSetAbsoluteRangeDatePicker } from '../../store/inputs/actions';
 import { SpyRoute } from '../../utils/route/spy_routes';
 import { navTabsNetwork, NetworkRoutes, NetworkRoutesLoading } from './navigation';
+import { filterAlertsNetwork } from './navigation/alerts_query_tab_body';
 import { NetworkEmptyPage } from './network_empty_page';
 import * as i18n from './translations';
 import { NetworkComponentProps } from './types';
-import { esQuery } from '../../../../../../../src/plugins/data/public';
 
 const KpiNetworkComponentManage = manageQuery(KpiNetworkComponent);
 const sourceId = 'default';
@@ -49,6 +51,14 @@ const NetworkComponent = React.memo<NetworkComponentProps>(
     capabilitiesFetched,
   }) => {
     const core = useKibanaCore();
+    const { tabName } = useParams();
+
+    const networkFilters = useMemo(() => {
+      if (tabName === 'alerts') {
+        return filters.length > 0 ? [...filters, filterAlertsNetwork] : [filterAlertsNetwork];
+      }
+      return filters;
+    }, [tabName]);
 
     return (
       <>
@@ -58,7 +68,7 @@ const NetworkComponent = React.memo<NetworkComponentProps>(
               config: esQuery.getEsQueryConfig(core.uiSettings),
               indexPattern,
               queries: [query],
-              filters,
+              filters: networkFilters,
             });
 
             return indicesExistOrDataTemporarilyUnavailable(indicesExist) ? (

diff --git a/x-pack/legacy/plugins/siem/server/lib/alerts/query.dsl.ts b/x-pack/legacy/plugins/siem/server/lib/alerts/query.dsl.ts
@@ -38,6 +38,24 @@ export const buildAlertsHistogramQuery = ({
 }: RequestBasicOptions) => {
   const filter = [
     ...createQueryFilterClauses(filterQuery),
+    {
+      bool: {
+        filter: [
+          {
+            bool: {
+              should: [
+                {
+                  match: {
+                    'event.kind': 'alert',
+                  },
+                },
+              ],
+              minimum_should_match: 1,
+            },
+          },
+        ],
+      },
+    },
     {
       range: {
         [timestamp]: {