[ML] Transforms: Adds date picker to transform wizard for data view w…

…ith time fields. (elastic#149049) Adds a date picker to the transform wizard for data views with time fields. The time range will be applied to previews only.
kibanamachine · Feb 1, 2023 · 0085aae · 0085aae
1 parent ea69956
commit 0085aae
Show file tree

Hide file tree

Showing 39 changed files with 931 additions and 329 deletions.
diff --git a/x-pack/plugins/ml/public/application/routing/routes/timeseriesexplorer.test.tsx b/x-pack/plugins/ml/public/application/routing/routes/timeseriesexplorer.test.tsx
@@ -55,6 +55,7 @@ const getMockedTimefilter = () => {
       enableAutoRefreshSelector: jest.fn(),
       getRefreshInterval: jest.fn(),
       setRefreshInterval: jest.fn(),
+      getActiveBounds: jest.fn(),
       getTime: jest.fn(),
       isAutoRefreshSelectorEnabled: jest.fn(),
       isTimeRangeSelectorEnabled: jest.fn(),
@@ -68,7 +69,7 @@ const getMockedTimefilter = () => {
   };
 };
 
-const getMockedDatePickeDependencies = () => {
+const getMockedDatePickerDependencies = () => {
   return {
     data: {
       query: {
@@ -138,7 +139,7 @@ describe('TimeSeriesExplorerUrlStateManager', () => {
     render(
       <MlContext.Provider value={kibanaContextValueMock}>
         <I18nProvider>
-          <DatePickerContextProvider {...getMockedDatePickeDependencies()}>
+          <DatePickerContextProvider {...getMockedDatePickerDependencies()}>
             <TimeSeriesExplorerUrlStateManager {...props} />
           </DatePickerContextProvider>
         </I18nProvider>

diff --git a/x-pack/plugins/transform/common/types/date_picker.ts b/x-pack/plugins/transform/common/types/date_picker.ts
@@ -0,0 +1,11 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0; you may not use this file except in compliance with the Elastic License
+ * 2.0.
+ */
+
+export interface TimeRangeMs {
+  from: number;
+  to: number;
+}
diff --git a/x-pack/plugins/transform/public/app/common/data_grid.test.ts b/x-pack/plugins/transform/public/app/common/data_grid.test.ts
@@ -5,39 +5,44 @@
  * 2.0.
  */
 
-import { getPreviewTransformRequestBody, SimpleQuery } from '.';
+import type { DataView } from '@kbn/data-views-plugin/common';
 
-import { getIndexDevConsoleStatement, getPivotPreviewDevConsoleStatement } from './data_grid';
+import { getPreviewTransformRequestBody, SimpleQuery } from '.';
+import { getIndexDevConsoleStatement, getTransformPreviewDevConsoleStatement } from './data_grid';
 
 describe('Transform: Data Grid', () => {
-  test('getPivotPreviewDevConsoleStatement()', () => {
+  test('getTransformPreviewDevConsoleStatement()', () => {
     const query: SimpleQuery = {
       query_string: {
         query: '*',
         default_operator: 'AND',
       },
     };
 
-    const request = getPreviewTransformRequestBody('the-index-pattern-title', query, {
-      pivot: {
-        group_by: {
-          'the-group-by-agg-name': {
-            terms: {
-              field: 'the-group-by-field',
+    const request = getPreviewTransformRequestBody(
+      { getIndexPattern: () => 'the-index-pattern-title' } as DataView,
+      query,
+      {
+        pivot: {
+          group_by: {
+            'the-group-by-agg-name': {
+              terms: {
+                field: 'the-group-by-field',
+              },
             },
           },
-        },
-        aggregations: {
-          'the-agg-agg-name': {
-            avg: {
-              field: 'the-agg-field',
+          aggregations: {
+            'the-agg-agg-name': {
+              avg: {
+                field: 'the-agg-field',
+              },
             },
           },
         },
-      },
-    });
+      }
+    );
 
-    const pivotPreviewDevConsoleStatement = getPivotPreviewDevConsoleStatement(request);
+    const pivotPreviewDevConsoleStatement = getTransformPreviewDevConsoleStatement(request);
 
     expect(pivotPreviewDevConsoleStatement).toBe(`POST _transform/_preview
 {

diff --git a/x-pack/plugins/transform/public/app/common/data_grid.ts b/x-pack/plugins/transform/public/app/common/data_grid.ts
@@ -7,15 +7,17 @@
 
 import type { PostTransformsPreviewRequestSchema } from '../../../common/api_schemas/transforms';
 
-import { PivotQuery } from './request';
+import { TransformConfigQuery } from './request';
 
 export const INIT_MAX_COLUMNS = 20;
 
-export const getPivotPreviewDevConsoleStatement = (request: PostTransformsPreviewRequestSchema) => {
+export const getTransformPreviewDevConsoleStatement = (
+  request: PostTransformsPreviewRequestSchema
+) => {
   return `POST _transform/_preview\n${JSON.stringify(request, null, 2)}\n`;
 };
 
-export const getIndexDevConsoleStatement = (query: PivotQuery, dataViewTitle: string) => {
+export const getIndexDevConsoleStatement = (query: TransformConfigQuery, dataViewTitle: string) => {
   return `GET ${dataViewTitle}/_search\n${JSON.stringify(
     {
       query,

diff --git a/x-pack/plugins/transform/public/app/common/index.ts b/x-pack/plugins/transform/public/app/common/index.ts
@@ -8,7 +8,7 @@
 export { isAggName } from './aggregations';
 export {
   getIndexDevConsoleStatement,
-  getPivotPreviewDevConsoleStatement,
+  getTransformPreviewDevConsoleStatement,
   INIT_MAX_COLUMNS,
 } from './data_grid';
 export type { EsDoc, EsDocSource } from './fields';
@@ -64,12 +64,12 @@ export {
   pivotGroupByFieldSupport,
   PIVOT_SUPPORTED_GROUP_BY_AGGS,
 } from './pivot_group_by';
-export type { PivotQuery, SimpleQuery } from './request';
+export type { TransformConfigQuery, SimpleQuery } from './request';
 export {
   defaultQuery,
   getPreviewTransformRequestBody,
   getCreateTransformRequestBody,
-  getPivotQuery,
+  getTransformConfigQuery,
   getRequestPayload,
   isDefaultQuery,
   isMatchAllQuery,

diff --git a/x-pack/plugins/transform/public/app/common/request.test.ts b/x-pack/plugins/transform/public/app/common/request.test.ts
@@ -5,6 +5,8 @@
  * 2.0.
  */
 
+import type { DataView } from '@kbn/data-views-plugin/common';
+
 import { PIVOT_SUPPORTED_AGGS } from '../../../common/types/pivot_aggs';
 
 import { PivotGroupByConfig } from '.';
@@ -19,19 +21,19 @@ import {
   getPreviewTransformRequestBody,
   getCreateTransformRequestBody,
   getCreateTransformSettingsRequestBody,
-  getPivotQuery,
+  getTransformConfigQuery,
   getMissingBucketConfig,
   getRequestPayload,
   isDefaultQuery,
   isMatchAllQuery,
   isSimpleQuery,
   matchAllQuery,
-  PivotQuery,
+  type TransformConfigQuery,
 } from './request';
 import { LatestFunctionConfigUI } from '../../../common/types/transform';
 import type { RuntimeField } from '@kbn/data-views-plugin/common';
 
-const simpleQuery: PivotQuery = { query_string: { query: 'airline:AAL' } };
+const simpleQuery: TransformConfigQuery = { query_string: { query: 'airline:AAL' } };
 
 const groupByTerms: PivotGroupByConfig = {
   agg: PIVOT_SUPPORTED_GROUP_BY_AGGS.TERMS,
@@ -62,12 +64,12 @@ describe('Transform: Common', () => {
 
   test('isDefaultQuery()', () => {
     expect(isDefaultQuery(defaultQuery)).toBe(true);
-    expect(isDefaultQuery(matchAllQuery)).toBe(false);
+    expect(isDefaultQuery(matchAllQuery)).toBe(true);
     expect(isDefaultQuery(simpleQuery)).toBe(false);
   });
 
-  test('getPivotQuery()', () => {
-    const query = getPivotQuery('the-query');
+  test('getTransformConfigQuery()', () => {
+    const query = getTransformConfigQuery('the-query');
 
     expect(query).toEqual({
       query_string: {
@@ -78,14 +80,18 @@ describe('Transform: Common', () => {
   });
 
   test('getPreviewTransformRequestBody()', () => {
-    const query = getPivotQuery('the-query');
+    const query = getTransformConfigQuery('the-query');
 
-    const request = getPreviewTransformRequestBody('the-data-view-title', query, {
-      pivot: {
-        aggregations: { 'the-agg-agg-name': { avg: { field: 'the-agg-field' } } },
-        group_by: { 'the-group-by-agg-name': { terms: { field: 'the-group-by-field' } } },
-      },
-    });
+    const request = getPreviewTransformRequestBody(
+      { getIndexPattern: () => 'the-data-view-title' } as DataView,
+      query,
+      {
+        pivot: {
+          aggregations: { 'the-agg-agg-name': { avg: { field: 'the-agg-field' } } },
+          group_by: { 'the-group-by-agg-name': { terms: { field: 'the-group-by-field' } } },
+        },
+      }
+    );
 
     expect(request).toEqual({
       pivot: {
@@ -100,13 +106,17 @@ describe('Transform: Common', () => {
   });
 
   test('getPreviewTransformRequestBody() with comma-separated index pattern', () => {
-    const query = getPivotQuery('the-query');
-    const request = getPreviewTransformRequestBody('the-data-view-title,the-other-title', query, {
-      pivot: {
-        aggregations: { 'the-agg-agg-name': { avg: { field: 'the-agg-field' } } },
-        group_by: { 'the-group-by-agg-name': { terms: { field: 'the-group-by-field' } } },
-      },
-    });
+    const query = getTransformConfigQuery('the-query');
+    const request = getPreviewTransformRequestBody(
+      { getIndexPattern: () => 'the-data-view-title,the-other-title' } as DataView,
+      query,
+      {
+        pivot: {
+          aggregations: { 'the-agg-agg-name': { avg: { field: 'the-agg-field' } } },
+          group_by: { 'the-group-by-agg-name': { terms: { field: 'the-group-by-field' } } },
+        },
+      }
+    );
 
     expect(request).toEqual({
       pivot: {
@@ -172,9 +182,9 @@ describe('Transform: Common', () => {
   });
 
   test('getPreviewTransformRequestBody() with missing_buckets config', () => {
-    const query = getPivotQuery('the-query');
+    const query = getTransformConfigQuery('the-query');
     const request = getPreviewTransformRequestBody(
-      'the-data-view-title',
+      { getIndexPattern: () => 'the-data-view-title' } as DataView,
       query,
       getRequestPayload([aggsAvg], [{ ...groupByTerms, ...{ missing_bucket: true } }])
     );
@@ -194,11 +204,12 @@ describe('Transform: Common', () => {
   });
 
   test('getCreateTransformRequestBody() skips default values', () => {
-    const pivotState: StepDefineExposedState = {
+    const transformConfigState: StepDefineExposedState = {
       aggList: { 'the-agg-name': aggsAvg },
       groupByList: { 'the-group-by-name': groupByTerms },
       isAdvancedPivotEditorEnabled: false,
       isAdvancedSourceEditorEnabled: false,
+      isDatePickerApplyEnabled: false,
       sourceConfigUpdated: false,
       searchLanguage: 'kuery',
       searchString: 'the-query',
@@ -239,8 +250,8 @@ describe('Transform: Common', () => {
     };
 
     const request = getCreateTransformRequestBody(
-      'the-data-view-title',
-      pivotState,
+      { getIndexPattern: () => 'the-data-view-title' } as DataView,
+      transformConfigState,
       transformDetailsState
     );
 
@@ -278,6 +289,7 @@ describe('Transform: Common', () => {
       groupByList: { 'the-group-by-name': groupByTerms },
       isAdvancedPivotEditorEnabled: false,
       isAdvancedSourceEditorEnabled: false,
+      isDatePickerApplyEnabled: false,
       sourceConfigUpdated: false,
       searchLanguage: 'kuery',
       searchString: 'the-query',
@@ -319,7 +331,7 @@ describe('Transform: Common', () => {
     };
 
     const request = getCreateTransformRequestBody(
-      'the-data-view-title',
+      { getIndexPattern: () => 'the-data-view-title' } as DataView,
       pivotState,
       transformDetailsState
     );