[Logs UI] Anomalies page dataset filtering (#71110) (#71657)

Adds dataset filtering to logs anomalies page

Co-authored-by: Elastic Machine <elasticmachine@users.noreply.github.com>

x-pack/plugins/infra/common/http_api/log_analysis/results/index.ts

@@ -10,3 +10,4 @@ export * from './log_entry_category_examples';
 export * from './log_entry_rate';
 export * from './log_entry_examples';
 export * from './log_entry_anomalies';
+export * from './log_entry_anomalies_datasets';

x-pack/plugins/infra/common/http_api/log_analysis/results/log_entry_anomalies.ts

@@ -128,6 +128,8 @@ export const getLogEntryAnomaliesRequestPayloadRT = rt.type({
       pagination: paginationRT,
       // Sort properties
       sort: sortRT,
+      // Dataset filters
+      datasets: rt.array(rt.string),
     }),
   ]),
 });

x-pack/plugins/infra/common/http_api/log_analysis/results/log_entry_anomalies_datasets.ts

@@ -0,0 +1,63 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License;
+ * you may not use this file except in compliance with the Elastic License.
+ */
+
+import * as rt from 'io-ts';
+
+import {
+  badRequestErrorRT,
+  forbiddenErrorRT,
+  timeRangeRT,
+  routeTimingMetadataRT,
+} from '../../shared';
+
+export const LOG_ANALYSIS_GET_LOG_ENTRY_ANOMALIES_DATASETS_PATH =
+  '/api/infra/log_analysis/results/log_entry_anomalies_datasets';
+
+/**
+ * request
+ */
+
+export const getLogEntryAnomaliesDatasetsRequestPayloadRT = rt.type({
+  data: rt.type({
+    // the id of the source configuration
+    sourceId: rt.string,
+    // the time range to fetch the anomalies datasets from
+    timeRange: timeRangeRT,
+  }),
+});
+
+export type GetLogEntryAnomaliesDatasetsRequestPayload = rt.TypeOf<
+  typeof getLogEntryAnomaliesDatasetsRequestPayloadRT
+>;
+
+/**
+ * response
+ */
+
+export const getLogEntryAnomaliesDatasetsSuccessReponsePayloadRT = rt.intersection([
+  rt.type({
+    data: rt.type({
+      datasets: rt.array(rt.string),
+    }),
+  }),
+  rt.partial({
+    timing: routeTimingMetadataRT,
+  }),
+]);
+
+export type GetLogEntryAnomaliesDatasetsSuccessResponsePayload = rt.TypeOf<
+  typeof getLogEntryAnomaliesDatasetsSuccessReponsePayloadRT
+>;
+
+export const getLogEntryAnomaliesDatasetsResponsePayloadRT = rt.union([
+  getLogEntryAnomaliesDatasetsSuccessReponsePayloadRT,
+  badRequestErrorRT,
+  forbiddenErrorRT,
+]);
+
+export type GetLogEntryAnomaliesDatasetsReponsePayload = rt.TypeOf<
+  typeof getLogEntryAnomaliesDatasetsResponsePayloadRT
+>;

x-pack/plugins/infra/common/http_api/log_analysis/results/log_entry_rate.ts

@@ -16,11 +16,16 @@ export const LOG_ANALYSIS_GET_LOG_ENTRY_RATE_PATH =
  */
 
 export const getLogEntryRateRequestPayloadRT = rt.type({
-  data: rt.type({
-    bucketDuration: rt.number,
-    sourceId: rt.string,
-    timeRange: timeRangeRT,
-  }),
+  data: rt.intersection([
+    rt.type({
+      bucketDuration: rt.number,
+      sourceId: rt.string,
+      timeRange: timeRangeRT,
+    }),
+    rt.partial({
+      datasets: rt.array(rt.string),
+    }),
+  ]),
 });
 
 export type GetLogEntryRateRequestPayload = rt.TypeOf<typeof getLogEntryRateRequestPayloadRT>;

x-pack/plugins/infra/public/pages/logs/log_entry_categories/sections/top_categories/datasets_selector.tsx → x-pack/plugins/infra/public/components/logging/log_analysis_results/datasets_selector.tsx

@@ -8,7 +8,7 @@ import { EuiComboBox, EuiComboBoxOptionOption } from '@elastic/eui';
 import { i18n } from '@kbn/i18n';
 import React, { useCallback, useMemo } from 'react';
 
-import { getFriendlyNameForPartitionId } from '../../../../../../common/log_analysis';
+import { getFriendlyNameForPartitionId } from '../../../../common/log_analysis';
 
 type DatasetOptionProps = EuiComboBoxOptionOption<string>;
 
@@ -51,7 +51,7 @@ export const DatasetsSelector: React.FunctionComponent<{
 };
 
 const datasetFilterPlaceholder = i18n.translate(
-  'xpack.infra.logs.logEntryCategories.datasetFilterPlaceholder',
+  'xpack.infra.logs.analysis.datasetFilterPlaceholder',
   {
     defaultMessage: 'Filter by datasets',
   }

x-pack/plugins/infra/public/pages/logs/log_entry_categories/sections/top_categories/top_categories_section.tsx

@@ -14,7 +14,7 @@ import { BetaBadge } from '../../../../../components/beta_badge';
 import { LoadingOverlayWrapper } from '../../../../../components/loading_overlay_wrapper';
 import { RecreateJobButton } from '../../../../../components/logging/log_analysis_job_status';
 import { AnalyzeInMlButton } from '../../../../../components/logging/log_analysis_results';
-import { DatasetsSelector } from './datasets_selector';
+import { DatasetsSelector } from '../../../../../components/logging/log_analysis_results/datasets_selector';
 import { TopCategoriesTable } from './top_categories_table';
 
 export const TopCategoriesSection: React.FunctionComponent<{

x-pack/plugins/infra/public/pages/logs/log_entry_rate/page_results_content.tsx

@@ -27,6 +27,7 @@ import {
   StringTimeRange,
   useLogAnalysisResultsUrlState,
 } from './use_log_entry_rate_results_url_state';
+import { DatasetsSelector } from '../../../components/logging/log_analysis_results/datasets_selector';
 
 export const SORT_DEFAULTS = {
   direction: 'desc' as const,
@@ -80,11 +81,14 @@ export const LogEntryRateResultsContent: React.FunctionComponent = () => {
     [queryTimeRange.value.endTime, queryTimeRange.value.startTime]
   );
 
+  const [selectedDatasets, setSelectedDatasets] = useState<string[]>([]);
+
   const { getLogEntryRate, isLoading, logEntryRate } = useLogEntryRateResults({
     sourceId,
     startTime: queryTimeRange.value.startTime,
     endTime: queryTimeRange.value.endTime,
     bucketDuration,
+    filteredDatasets: selectedDatasets,
   });
 
   const {
@@ -97,12 +101,15 @@ export const LogEntryRateResultsContent: React.FunctionComponent = () => {
     changePaginationOptions,
     sortOptions,
     paginationOptions,
+    datasets,
+    isLoadingDatasets,
   } = useLogEntryAnomaliesResults({
     sourceId,
     startTime: queryTimeRange.value.startTime,
     endTime: queryTimeRange.value.endTime,
     defaultSortOptions: SORT_DEFAULTS,
     defaultPaginationOptions: PAGINATION_DEFAULTS,
+    filteredDatasets: selectedDatasets,
   });
 
   const handleQueryTimeRangeChange = useCallback(
@@ -175,7 +182,7 @@ export const LogEntryRateResultsContent: React.FunctionComponent = () => {
 
   useEffect(() => {
     getLogEntryRate();
-  }, [getLogEntryRate, queryTimeRange.lastChangedTime]);
+  }, [getLogEntryRate, selectedDatasets, queryTimeRange.lastChangedTime]);
 
   useInterval(
     () => {
@@ -191,7 +198,15 @@ export const LogEntryRateResultsContent: React.FunctionComponent = () => {
     <ResultsContentPage>
       <EuiFlexGroup direction="column">
         <EuiFlexItem grow={false}>
-          <EuiFlexGroup justifyContent="flexEnd">
+          <EuiFlexGroup justifyContent="spaceBetween">
+            <EuiFlexItem>
+              <DatasetsSelector
+                availableDatasets={datasets}
+                isLoading={isLoadingDatasets}
+                selectedDatasets={selectedDatasets}
+                onChangeDatasetSelection={setSelectedDatasets}
+              />
+            </EuiFlexItem>
             <EuiFlexItem grow={false}>
               <EuiSuperDatePicker
                 start={selectedTimeRange.startTime}

x-pack/plugins/infra/public/pages/logs/log_entry_rate/service_calls/get_log_entry_anomalies.ts

@@ -18,7 +18,8 @@ export const callGetLogEntryAnomaliesAPI = async (
   startTime: number,
   endTime: number,
   sort: Sort,
-  pagination: Pagination
+  pagination: Pagination,
+  datasets?: string[]
 ) => {
   const response = await npStart.http.fetch(LOG_ANALYSIS_GET_LOG_ENTRY_ANOMALIES_PATH, {
     method: 'POST',
@@ -32,6 +33,7 @@ export const callGetLogEntryAnomaliesAPI = async (
           },
           sort,
           pagination,
+          datasets,
         },
       })
     ),

x-pack/plugins/infra/public/pages/logs/log_entry_rate/service_calls/get_log_entry_anomalies_datasets.ts

@@ -0,0 +1,36 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License;
+ * you may not use this file except in compliance with the Elastic License.
+ */
+
+import { npStart } from '../../../../legacy_singletons';
+import { decodeOrThrow } from '../../../../../common/runtime_types';
+import {
+  getLogEntryAnomaliesDatasetsRequestPayloadRT,
+  getLogEntryAnomaliesDatasetsSuccessReponsePayloadRT,
+  LOG_ANALYSIS_GET_LOG_ENTRY_ANOMALIES_DATASETS_PATH,
+} from '../../../../../common/http_api/log_analysis';
+
+export const callGetLogEntryAnomaliesDatasetsAPI = async (
+  sourceId: string,
+  startTime: number,
+  endTime: number
+) => {
+  const response = await npStart.http.fetch(LOG_ANALYSIS_GET_LOG_ENTRY_ANOMALIES_DATASETS_PATH, {
+    method: 'POST',
+    body: JSON.stringify(
+      getLogEntryAnomaliesDatasetsRequestPayloadRT.encode({
+        data: {
+          sourceId,
+          timeRange: {
+            startTime,
+            endTime,
+          },
+        },
+      })
+    ),
+  });
+
+  return decodeOrThrow(getLogEntryAnomaliesDatasetsSuccessReponsePayloadRT)(response);
+};

x-pack/plugins/infra/public/pages/logs/log_entry_rate/service_calls/get_log_entry_rate.ts

@@ -19,7 +19,8 @@ export const callGetLogEntryRateAPI = async (
   sourceId: string,
   startTime: number,
   endTime: number,
-  bucketDuration: number
+  bucketDuration: number,
+  datasets?: string[]
 ) => {
   const response = await npStart.http.fetch(LOG_ANALYSIS_GET_LOG_ENTRY_RATE_PATH, {
     method: 'POST',
@@ -32,6 +33,7 @@ export const callGetLogEntryRateAPI = async (
             endTime,
           },
           bucketDuration,
+          datasets,
         },
       })
     ),