From 0f42b1aeb5ae5eda0f1ff7021b8c72afa93124a0 Mon Sep 17 00:00:00 2001
From: Pete Harverson <peteharverson@users.noreply.github.com>
Date: Mon, 24 Aug 2020 11:09:02 +0100
Subject: [PATCH] [ML] Add date picker back onto index based data visualizer
 page (#75658)

Co-authored-by: Elastic Machine <elasticmachine@users.noreply.github.com>
---
 .../datavisualizer/index_based/page.tsx       | 29 +++++++++++--------
 1 file changed, 17 insertions(+), 12 deletions(-)

diff --git a/x-pack/plugins/ml/public/application/datavisualizer/index_based/page.tsx b/x-pack/plugins/ml/public/application/datavisualizer/index_based/page.tsx
index 3c332d305d7e9..26ed3152058dd 100644
--- a/x-pack/plugins/ml/public/application/datavisualizer/index_based/page.tsx
+++ b/x-pack/plugins/ml/public/application/datavisualizer/index_based/page.tsx
@@ -31,6 +31,7 @@ import {
 } from '../../../../../../../src/plugins/data/public';
 import { SavedSearchSavedObject } from '../../../../common/types/kibana';
 import { NavigationMenu } from '../../components/navigation_menu';
+import { DatePickerWrapper } from '../../components/navigation_menu/date_picker_wrapper';
 import { ML_JOB_FIELD_TYPES } from '../../../../common/constants/field_types';
 import { SEARCH_QUERY_LANGUAGE } from '../../../../common/constants/search';
 import { isFullLicense } from '../../license';
@@ -655,20 +656,24 @@ export const Page: FC = () => {
                     <h1>{currentIndexPattern.title}</h1>
                   </EuiTitle>
                 </EuiPageContentHeaderSection>
-                {currentIndexPattern.timeFieldName !== undefined && (
-                  <EuiPageContentHeaderSection data-test-subj="mlDataVisualizerTimeRangeSelectorSection">
-                    <FullTimeRangeSelector
-                      indexPattern={currentIndexPattern}
-                      query={combinedQuery}
-                      disabled={false}
-                    />
-                  </EuiPageContentHeaderSection>
-                )}
+                <EuiPageContentHeaderSection data-test-subj="mlDataVisualizerTimeRangeSelectorSection">
+                  <EuiFlexGroup alignItems="center" justifyContent="flexEnd" gutterSize="s">
+                    {currentIndexPattern.timeFieldName !== undefined && (
+                      <EuiFlexItem grow={false}>
+                        <FullTimeRangeSelector
+                          indexPattern={currentIndexPattern}
+                          query={combinedQuery}
+                          disabled={false}
+                        />
+                      </EuiFlexItem>
+                    )}
+                    <EuiFlexItem grow={false}>
+                      <DatePickerWrapper />
+                    </EuiFlexItem>
+                  </EuiFlexGroup>
+                </EuiPageContentHeaderSection>
               </EuiPageContentHeader>
             </EuiFlexItem>
-            {showActionsPanel === true && (
-              <EuiFlexItem grow={false} style={{ width: wizardPanelWidth }} />
-            )}
           </EuiFlexGroup>
           <EuiSpacer size="m" />
           <EuiPageContentBody>