[ML] Transforms: Adds "Use full data" button to transform creation wi…

…zard. (elastic#150030)

Adds the "Use full data" button including the option whether to include
the frozen data tier to the transform creation wizard.

x-pack/plugins/transform/common/types/storage.ts

@@ -0,0 +1,21 @@
+/*
+ * 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.
+ */
+
+import { type FrozenTierPreference } from '@kbn/ml-date-picker';
+
+export const TRANSFORM_FROZEN_TIER_PREFERENCE = 'transform.frozenDataTierPreference';
+
+export type TransformStorage = Partial<{
+  [TRANSFORM_FROZEN_TIER_PREFERENCE]: FrozenTierPreference;
+}> | null;
+
+export type TransformStorageKey = keyof Exclude<TransformStorage, null>;
+
+export type TransformStorageMapped<T extends TransformStorageKey> =
+  T extends typeof TRANSFORM_FROZEN_TIER_PREFERENCE ? FrozenTierPreference | undefined : null;
+
+export const TRANSFORM_STORAGE_KEYS = [TRANSFORM_FROZEN_TIER_PREFERENCE] as const;

x-pack/plugins/transform/public/app/sections/create_transform/components/step_define/step_define_form.tsx

@@ -24,12 +24,24 @@ import {
 } from '@elastic/eui';
 
 import { i18n } from '@kbn/i18n';
-import { mlTimefilterRefresh$, useTimefilter, DatePickerWrapper } from '@kbn/ml-date-picker';
+import {
+  mlTimefilterRefresh$,
+  useTimefilter,
+  DatePickerWrapper,
+  FullTimeRangeSelector,
+  FROZEN_TIER_PREFERENCE,
+} from '@kbn/ml-date-picker';
+import { useStorage } from '@kbn/ml-local-storage';
 import { useUrlState } from '@kbn/ml-url-state';
 
 import { PivotAggDict } from '../../../../../../common/types/pivot_aggs';
 import { PivotGroupByDict } from '../../../../../../common/types/pivot_group_by';
 import { TRANSFORM_FUNCTION } from '../../../../../../common/constants';
+import {
+  TRANSFORM_FROZEN_TIER_PREFERENCE,
+  type TransformStorageKey,
+  type TransformStorageMapped,
+} from '../../../../../../common/types/storage';
 
 import {
   getIndexDevConsoleStatement,
@@ -89,6 +101,14 @@ export const StepDefineForm: FC<StepDefineFormProps> = React.memo((props) => {
   const {
     ml: { DataGrid },
   } = useAppDependencies();
+  const [frozenDataPreference, setFrozenDataPreference] = useStorage<
+    TransformStorageKey,
+    TransformStorageMapped<typeof TRANSFORM_FROZEN_TIER_PREFERENCE>
+  >(
+    TRANSFORM_FROZEN_TIER_PREFERENCE,
+    // By default we will exclude frozen data tier
+    FROZEN_TIER_PREFERENCE.EXCLUDE
+  );
   const toastNotifications = useToastNotifications();
   const stepDefineForm = useStepDefineForm(props);
 
@@ -311,6 +331,14 @@ export const StepDefineForm: FC<StepDefineFormProps> = React.memo((props) => {
                     </EuiFlexItem>
                   </EuiFlexGroup>
                 )}
+                <FullTimeRangeSelector
+                  frozenDataPreference={frozenDataPreference}
+                  setFrozenDataPreference={setFrozenDataPreference}
+                  dataView={dataView}
+                  query={undefined}
+                  disabled={false}
+                  timefilter={timefilter}
+                />
               </EuiFlexItem>
             </EuiFlexGroup>
           </EuiFormRow>

x-pack/test/functional/apps/transform/creation/index_pattern/creation_index_pattern.ts

@@ -96,6 +96,10 @@ export default function ({ getService, getPageObjects }: FtrProviderContext) {
         discoverAdjustSuperDatePicker: true,
         numFailureRetries: '7',
         expected: {
+          fullTimeRange: {
+            start: 'Jun 12, 2019 @ 00:04:19.000',
+            end: 'Jul 12, 2019 @ 23:45:36.000',
+          },
           pivotAdvancedEditorValueArr: ['{', '  "group_by": {', '    "category": {'],
           pivotAdvancedEditorValue: {
             group_by: {
@@ -294,6 +298,10 @@ export default function ({ getService, getPageObjects }: FtrProviderContext) {
         discoverAdjustSuperDatePicker: false,
         numFailureRetries: '-1',
         expected: {
+          fullTimeRange: {
+            start: 'Jun 12, 2019 @ 00:04:19.000',
+            end: 'Jul 12, 2019 @ 23:45:36.000',
+          },
           pivotAdvancedEditorValueArr: ['{', '  "group_by": {', '    "geoip.country_iso_code": {'],
           pivotAdvancedEditorValue: {
             group_by: {
@@ -368,6 +376,10 @@ export default function ({ getService, getPageObjects }: FtrProviderContext) {
         discoverAdjustSuperDatePicker: false,
         numFailureRetries: '0',
         expected: {
+          fullTimeRange: {
+            start: 'Jun 12, 2019 @ 00:04:19.000',
+            end: 'Jul 12, 2019 @ 23:45:36.000',
+          },
           pivotAdvancedEditorValueArr: ['{', '  "group_by": {', '    "customer_gender": {'],
           pivotAdvancedEditorValue: {
             group_by: {
@@ -428,6 +440,10 @@ export default function ({ getService, getPageObjects }: FtrProviderContext) {
         discoverAdjustSuperDatePicker: true,
         numFailureRetries: '101',
         expected: {
+          fullTimeRange: {
+            start: 'Jun 12, 2019 @ 00:04:19.000',
+            end: 'Jul 12, 2019 @ 23:45:36.000',
+          },
           latestPreview: {
             column: 0,
             values: [],
@@ -506,6 +522,25 @@ export default function ({ getService, getPageObjects }: FtrProviderContext) {
             testData.expected.indexPreview.rows
           );
 
+          await transform.testExecution.logTestStep(
+            `sets the date picker back to the default '15 minutes ago'`
+          );
+          await transform.datePicker.quickSelect(15, 'm');
+
+          await transform.testExecution.logTestStep('again displays an empty index preview');
+          await transform.wizard.assertIndexPreviewEmpty();
+
+          await transform.testExecution.logTestStep(
+            `clicks the 'Use full data' button to auto-select time range`
+          );
+          await transform.datePicker.clickUseFullDataButton(testData.expected.fullTimeRange);
+
+          await transform.testExecution.logTestStep('again shows the index preview');
+          await transform.wizard.assertIndexPreview(
+            testData.expected.indexPreview.columns,
+            testData.expected.indexPreview.rows
+          );
+
           await transform.testExecution.logTestStep('displays an empty transform preview');
           await transform.wizard.assertTransformPreviewEmpty();
 

x-pack/test/functional/services/transform/date_picker.ts

@@ -11,8 +11,9 @@ import { FtrProviderContext } from '../../ftr_provider_context';
 
 export function TransformDatePickerProvider({ getService, getPageObjects }: FtrProviderContext) {
   const find = getService('find');
-  const testSubjects = getService('testSubjects');
   const pageObjects = getPageObjects(['timePicker']);
+  const retry = getService('retry');
+  const testSubjects = getService('testSubjects');
 
   return {
     async assertSuperDatePickerToggleQuickMenuButtonExists() {
@@ -45,5 +46,23 @@ export function TransformDatePickerProvider({ getService, getPageObjects }: FtrP
     async setTimeRange(fromTime: string, toTime: string) {
       await pageObjects.timePicker.setAbsoluteRange(fromTime, toTime);
     },
+
+    async clickUseFullDataButton(expectedTimeConfig: { start: string; end: string }) {
+      await testSubjects.existOrFail('mlDatePickerButtonUseFullData');
+      await testSubjects.clickWhenNotDisabledWithoutRetry('mlDatePickerButtonUseFullData');
+
+      await retry.try(async () => {
+        const start = await testSubjects.getVisibleText('superDatePickerstartDatePopoverButton');
+        const end = await testSubjects.getVisibleText('superDatePickerendDatePopoverButton');
+        const actualTimeConfig = { start, end };
+
+        expect(actualTimeConfig).to.eql(
+          expectedTimeConfig,
+          `Transform time config should be '${JSON.stringify(
+            expectedTimeConfig
+          )}' (got '${JSON.stringify(actualTimeConfig)}')`
+        );
+      });
+    },
   };
 }