From 8ddcba82e076089d2cac574b33084cefbca0814f Mon Sep 17 00:00:00 2001
From: "Michael S. Molina" <70410625+michael-s-molina@users.noreply.github.com>
Date: Wed, 31 Mar 2021 19:42:14 -0300
Subject: [PATCH] chore: Removes Select duplication (#13477)

---
 .../CRUD/alert/AlertReportModal_spec.jsx      |  3 +--
 .../Select/NativeSelect.tsx}                  | 20 ++++++++-----------
 .../src/components/Select/index.ts            |  1 +
 ...AdhocFilterEditPopoverSimpleTabContent.jsx |  2 +-
 .../AdhocFilterEditPopoverSqlTabContent.jsx   |  2 +-
 .../MetricControl/AdhocMetricEditPopover.jsx  |  2 +-
 .../src/views/CRUD/alert/AlertReportModal.tsx |  3 +--
 7 files changed, 14 insertions(+), 19 deletions(-)
 rename superset-frontend/src/{common/components/Select.tsx => components/Select/NativeSelect.tsx} (74%)

diff --git a/superset-frontend/spec/javascripts/views/CRUD/alert/AlertReportModal_spec.jsx b/superset-frontend/spec/javascripts/views/CRUD/alert/AlertReportModal_spec.jsx
index 941faf17663..b4a0131ae4b 100644
--- a/superset-frontend/spec/javascripts/views/CRUD/alert/AlertReportModal_spec.jsx
+++ b/superset-frontend/spec/javascripts/views/CRUD/alert/AlertReportModal_spec.jsx
@@ -24,9 +24,8 @@ import fetchMock from 'fetch-mock';
 import { act } from 'react-dom/test-utils';
 import AlertReportModal from 'src/views/CRUD/alert/AlertReportModal';
 import Modal from 'src/common/components/Modal';
-import { AsyncSelect } from 'src/components/Select';
+import { AsyncSelect, NativeGraySelect as Select } from 'src/components/Select';
 import { Radio } from 'src/common/components/Radio';
-import { GraySelect as Select } from 'src/common/components/Select';
 import { Switch } from 'src/common/components/Switch';
 import TextAreaControl from 'src/explore/components/controls/TextAreaControl';
 import waitForComponentToPaint from 'spec/helpers/waitForComponentToPaint';
diff --git a/superset-frontend/src/common/components/Select.tsx b/superset-frontend/src/components/Select/NativeSelect.tsx
similarity index 74%
rename from superset-frontend/src/common/components/Select.tsx
rename to superset-frontend/src/components/Select/NativeSelect.tsx
index 49dc91d692e..604496701eb 100644
--- a/superset-frontend/src/common/components/Select.tsx
+++ b/superset-frontend/src/components/Select/NativeSelect.tsx
@@ -18,18 +18,15 @@
  */
 import React from 'react';
 import { styled } from '@superset-ui/core';
-import { Select as BaseSelect, SelectProps } from 'src/common/components';
+import Select, { SelectProps } from 'antd/lib/select';
 
-const StyledSelect = styled((props: SelectProps<any>) => (
-  <BaseSelect
-    getPopupContainer={(trigger: any) => trigger.parentNode}
-    {...props}
-  />
+const StyledNativeSelect = styled((props: SelectProps<any>) => (
+  <Select getPopupContainer={(trigger: any) => trigger.parentNode} {...props} />
 ))`
   display: block;
 `;
 
-const StyledGraySelect = styled(StyledSelect)`
+const StyledNativeGraySelect = styled(Select)`
   &.ant-select-single {
     .ant-select-selector {
       height: 36px;
@@ -49,12 +46,11 @@ const StyledGraySelect = styled(StyledSelect)`
     }
   }
 `;
-const StyledOption = BaseSelect.Option;
 
-export const Select = Object.assign(StyledSelect, {
-  Option: StyledOption,
+export const NativeSelect = Object.assign(StyledNativeSelect, {
+  Option: Select.Option,
 });
 
-export const GraySelect = Object.assign(StyledGraySelect, {
-  Option: StyledOption,
+export const NativeGraySelect = Object.assign(StyledNativeGraySelect, {
+  Option: Select.Option,
 });
diff --git a/superset-frontend/src/components/Select/index.ts b/superset-frontend/src/components/Select/index.ts
index 14f41fd7419..009e8edf220 100644
--- a/superset-frontend/src/components/Select/index.ts
+++ b/superset-frontend/src/components/Select/index.ts
@@ -20,3 +20,4 @@ export * from './Select';
 export * from './styles';
 export { default } from './Select';
 export { default as OnPasteSelect } from './OnPasteSelect';
+export { NativeSelect, NativeGraySelect } from './NativeSelect';
diff --git a/superset-frontend/src/explore/components/controls/FilterControl/AdhocFilterEditPopoverSimpleTabContent.jsx b/superset-frontend/src/explore/components/controls/FilterControl/AdhocFilterEditPopoverSimpleTabContent.jsx
index f4091a22045..3fc36101b73 100644
--- a/superset-frontend/src/explore/components/controls/FilterControl/AdhocFilterEditPopoverSimpleTabContent.jsx
+++ b/superset-frontend/src/explore/components/controls/FilterControl/AdhocFilterEditPopoverSimpleTabContent.jsx
@@ -19,7 +19,7 @@
 import React from 'react';
 import PropTypes from 'prop-types';
 import { FormGroup } from 'react-bootstrap';
-import { Select } from 'src/common/components/Select';
+import { NativeSelect as Select } from 'src/components/Select';
 import { Input } from 'src/common/components';
 import { t, SupersetClient, styled } from '@superset-ui/core';
 
diff --git a/superset-frontend/src/explore/components/controls/FilterControl/AdhocFilterEditPopoverSqlTabContent.jsx b/superset-frontend/src/explore/components/controls/FilterControl/AdhocFilterEditPopoverSqlTabContent.jsx
index 068b293de58..7432bd7ac33 100644
--- a/superset-frontend/src/explore/components/controls/FilterControl/AdhocFilterEditPopoverSqlTabContent.jsx
+++ b/superset-frontend/src/explore/components/controls/FilterControl/AdhocFilterEditPopoverSqlTabContent.jsx
@@ -19,7 +19,7 @@
 import React from 'react';
 import PropTypes from 'prop-types';
 import { FormGroup } from 'react-bootstrap';
-import { Select } from 'src/common/components/Select';
+import { NativeSelect as Select } from 'src/components/Select';
 import { t } from '@superset-ui/core';
 import { SQLEditor } from 'src/components/AsyncAceEditor';
 import sqlKeywords from 'src/SqlLab/utils/sqlKeywords';
diff --git a/superset-frontend/src/explore/components/controls/MetricControl/AdhocMetricEditPopover.jsx b/superset-frontend/src/explore/components/controls/MetricControl/AdhocMetricEditPopover.jsx
index 9dd50153072..4e314c44e2e 100644
--- a/superset-frontend/src/explore/components/controls/MetricControl/AdhocMetricEditPopover.jsx
+++ b/superset-frontend/src/explore/components/controls/MetricControl/AdhocMetricEditPopover.jsx
@@ -22,7 +22,7 @@ import PropTypes from 'prop-types';
 import { FormGroup } from 'react-bootstrap';
 import Tabs from 'src/common/components/Tabs';
 import Button from 'src/components/Button';
-import { Select } from 'src/common/components/Select';
+import { NativeSelect as Select } from 'src/components/Select';
 import { styled, t } from '@superset-ui/core';
 import { ColumnOption, MetricOption } from '@superset-ui/chart-controls';
 
diff --git a/superset-frontend/src/views/CRUD/alert/AlertReportModal.tsx b/superset-frontend/src/views/CRUD/alert/AlertReportModal.tsx
index fd73adcc6a6..ea9422cfafd 100644
--- a/superset-frontend/src/views/CRUD/alert/AlertReportModal.tsx
+++ b/superset-frontend/src/views/CRUD/alert/AlertReportModal.tsx
@@ -24,9 +24,8 @@ import { useSingleViewResource } from 'src/views/CRUD/hooks';
 import Icon from 'src/components/Icon';
 import Modal from 'src/common/components/Modal';
 import { Switch } from 'src/common/components/Switch';
-import { GraySelect as Select } from 'src/common/components/Select';
 import { Radio } from 'src/common/components/Radio';
-import { AsyncSelect } from 'src/components/Select';
+import { AsyncSelect, NativeGraySelect as Select } from 'src/components/Select';
 import withToasts from 'src/messageToasts/enhancers/withToasts';
 import Owner from 'src/types/Owner';
 import TextAreaControl from 'src/explore/components/controls/TextAreaControl';