From 54435e689e0730e77a514d60068aeb3ae28f762a Mon Sep 17 00:00:00 2001
From: Ashik Meerankutty <ashik9591@gmail.com>
Date: Sat, 4 Apr 2020 08:49:05 +0530
Subject: [PATCH 1/3] fixed console error in super date picker popover content

---
 .../date_popover/date_popover_content.js                  | 8 +++++++-
 1 file changed, 7 insertions(+), 1 deletion(-)

diff --git a/src/components/date_picker/super_date_picker/date_popover/date_popover_content.js b/src/components/date_picker/super_date_picker/date_popover/date_popover_content.js
index 58d120dad36..bd7380129e0 100644
--- a/src/components/date_picker/super_date_picker/date_popover/date_popover_content.js
+++ b/src/components/date_picker/super_date_picker/date_popover/date_popover_content.js
@@ -100,12 +100,18 @@ export function EuiDatePopoverContent({
     ];
   };
 
+  const initialSelectedTab = {
+    name: getDateMode(value),
+    id: getDateMode(value),
+    content: getDateMode(value),
+  };
+
   return (
     <EuiTabbedContent
       className="euiDatePopoverContent"
       tabs={renderTabs()}
       autoFocus="selected"
-      initialSelectedTab={{ id: getDateMode(value) }}
+      initialSelectedTab={initialSelectedTab}
       onTabClick={onTabClick}
       size="s"
       expand

From 8eb75fd9037988fbca15055e4adaeac85bd70d24 Mon Sep 17 00:00:00 2001
From: Ashik Meerankutty <ashik9591@gmail.com>
Date: Tue, 7 Apr 2020 09:38:02 +0530
Subject: [PATCH 2/3] converted render tabs to array and filter initialTab from
 renderTabs

---
 .../date_popover/date_popover_content.js      | 131 +++++++++---------
 1 file changed, 63 insertions(+), 68 deletions(-)

diff --git a/src/components/date_picker/super_date_picker/date_popover/date_popover_content.js b/src/components/date_picker/super_date_picker/date_popover/date_popover_content.js
index bd7380129e0..333bc2071af 100644
--- a/src/components/date_picker/super_date_picker/date_popover/date_popover_content.js
+++ b/src/components/date_picker/super_date_picker/date_popover/date_popover_content.js
@@ -37,81 +37,76 @@ export function EuiDatePopoverContent({
 
   const ariaLabel = `${position === 'start' ? 'Start' : 'End'} date:`;
 
-  const renderTabs = () => {
-    return [
-      {
-        id: DATE_MODES.ABSOLUTE,
-        name: 'Absolute',
-        content: (
-          <EuiAbsoluteTab
-            dateFormat={dateFormat}
-            timeFormat={timeFormat}
-            locale={locale}
-            value={value}
-            onChange={onChange}
-            roundUp={roundUp}
-            position={position}
-          />
-        ),
-        'data-test-subj': 'superDatePickerAbsoluteTab',
-        'aria-label': `${ariaLabel} Absolute`,
-      },
-      {
-        id: DATE_MODES.RELATIVE,
-        name: 'Relative',
-        content: (
-          <EuiRelativeTab
-            dateFormat={dateFormat}
-            locale={locale}
-            value={toAbsoluteString(value, roundUp)}
-            onChange={onChange}
-            roundUp={roundUp}
-            position={position}
-          />
-        ),
-        'data-test-subj': 'superDatePickerRelativeTab',
-        'aria-label': `${ariaLabel} Relative`,
-      },
-      {
-        id: DATE_MODES.NOW,
-        name: 'Now',
-        content: (
-          <EuiText
+  const renderTabs = [
+    {
+      id: DATE_MODES.ABSOLUTE,
+      name: 'Absolute',
+      content: (
+        <EuiAbsoluteTab
+          dateFormat={dateFormat}
+          timeFormat={timeFormat}
+          locale={locale}
+          value={value}
+          onChange={onChange}
+          roundUp={roundUp}
+          position={position}
+        />
+      ),
+      'data-test-subj': 'superDatePickerAbsoluteTab',
+      'aria-label': `${ariaLabel} Absolute`,
+    },
+    {
+      id: DATE_MODES.RELATIVE,
+      name: 'Relative',
+      content: (
+        <EuiRelativeTab
+          dateFormat={dateFormat}
+          locale={locale}
+          value={toAbsoluteString(value, roundUp)}
+          onChange={onChange}
+          roundUp={roundUp}
+          position={position}
+        />
+      ),
+      'data-test-subj': 'superDatePickerRelativeTab',
+      'aria-label': `${ariaLabel} Relative`,
+    },
+    {
+      id: DATE_MODES.NOW,
+      name: 'Now',
+      content: (
+        <EuiText
+          size="s"
+          color="subdued"
+          className="euiDatePopoverContent__padded--large">
+          <p>
+            Setting the time to &quot;now&quot; means that on every refresh this
+            time will be set to the time of the refresh.
+          </p>
+          <EuiButton
+            data-test-subj="superDatePickerNowButton"
+            onClick={() => onChange('now')}
+            fullWidth
             size="s"
-            color="subdued"
-            className="euiDatePopoverContent__padded--large">
-            <p>
-              Setting the time to &quot;now&quot; means that on every refresh
-              this time will be set to the time of the refresh.
-            </p>
-            <EuiButton
-              data-test-subj="superDatePickerNowButton"
-              onClick={() => onChange('now')}
-              fullWidth
-              size="s"
-              fill>
-              Set {position} date and time to now
-            </EuiButton>
-          </EuiText>
-        ),
-        'data-test-subj': 'superDatePickerNowTab',
-        'aria-label': `${ariaLabel} Now`,
-      },
-    ];
-  };
+            fill>
+            Set {position} date and time to now
+          </EuiButton>
+        </EuiText>
+      ),
+      'data-test-subj': 'superDatePickerNowTab',
+      'aria-label': `${ariaLabel} Now`,
+    },
+  ];
 
-  const initialSelectedTab = {
-    name: getDateMode(value),
-    id: getDateMode(value),
-    content: getDateMode(value),
-  };
+  const initialSelectedTab = () =>
+    renderTabs.filter(tabs => tabs.id === getDateMode(value))[0];
 
   return (
     <EuiTabbedContent
       className="euiDatePopoverContent"
-      tabs={renderTabs()}
+      tabs={renderTabs}
       autoFocus="selected"
-      initialSelectedTab={initialSelectedTab}
+      initialSelectedTab={initialSelectedTab()}
       onTabClick={onTabClick}
       size="s"
       expand

From d53cfeb001148a4d48b9c59d5274b9e2c20b52d2 Mon Sep 17 00:00:00 2001
From: Greg Thompson <thompson.glowe@gmail.com>
Date: Tue, 7 Apr 2020 13:06:20 -0500
Subject: [PATCH 3/3] CL

---
 CHANGELOG.md | 1 +
 1 file changed, 1 insertion(+)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index d84867359d8..12500a307e1 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -13,6 +13,7 @@
 - Fixed the `img` element in `EuiIcon` using custom SVGs to have an `alt` attribute with an empty string, rather than no `alt` attribute at all ([#3245](https://github.com/elastic/eui/pull/3245))
 - Added overflows to EuiDataGrid toolbar dropdowns when there are many columns ([#3238](https://github.com/elastic/eui/pull/3238))
 - Fixed `EuiIcon`'s icon `type` definition to allow custom React components ([#3252](https://github.com/elastic/eui/pull/3252))
+- Fixed `initialSelectedTab` properties used in `EuiDatePopoverContent` ([#3254](https://github.com/elastic/eui/pull/3254))
 
 ## [`22.3.0`](https://github.com/elastic/eui/tree/v22.3.0)