You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@superset.apache.org by vi...@apache.org on 2021/01/25 13:11:46 UTC

[superset] 10/38: refactor(explore): move MetricControl and FilterControl to sub-component (#12446)

This is an automated email from the ASF dual-hosted git repository.

villebro pushed a commit to branch 1.0
in repository https://gitbox.apache.org/repos/asf/superset.git

commit 74f64b1794cd9a4423b1a5ccbf443debb2b59611
Author: Yongjie Zhao <yo...@gmail.com>
AuthorDate: Tue Jan 19 22:46:28 2021 +0800

    refactor(explore): move MetricControl and FilterControl to sub-component (#12446)
    
    * wip
    
    * wip
    
    * wip
    
    * wip
    
    * move spec
    
    * wip
    
    * wip
    
    * remove unused file
    
    * wip
    
    * wip
    
    * Update superset-frontend/spec/javascripts/explore/components/AdhocFilterEditPopoverSqlTabContent_spec.jsx
    
    Co-authored-by: Ville Brofeldt <33...@users.noreply.github.com>
    
    * Update superset-frontend/spec/javascripts/explore/components/AdhocFilterOption_spec.jsx
    
    Co-authored-by: Ville Brofeldt <33...@users.noreply.github.com>
    
    * Update superset-frontend/spec/javascripts/explore/components/AdhocMetricEditPopoverTitle_spec.jsx
    
    Co-authored-by: Ville Brofeldt <33...@users.noreply.github.com>
    
    Co-authored-by: Ville Brofeldt <33...@users.noreply.github.com>
---
 .../spec/javascripts/explore/AdhocFilter_spec.js   |  2 +-
 .../spec/javascripts/explore/AdhocMetric_spec.js   |  4 +++-
 .../explore/components/AdhocFilterControl_spec.jsx |  6 ++---
 ...AdhocFilterEditPopoverSimpleTabContent_spec.jsx |  6 ++---
 .../AdhocFilterEditPopoverSqlTabContent_spec.jsx   |  4 ++--
 .../components/AdhocFilterEditPopover_spec.jsx     | 10 ++++----
 .../explore/components/AdhocFilterOption_spec.jsx  |  4 ++--
 .../AdhocMetricEditPopoverTitle_spec.jsx           |  2 +-
 .../components/AdhocMetricEditPopover_spec.jsx     |  6 +++--
 .../explore/components/AdhocMetricOption_spec.jsx  |  4 ++--
 .../components/AdhocMetricStaticOption_spec.jsx    |  6 +++--
 .../components/FilterDefinitionOption_spec.jsx     |  8 ++++---
 .../components/FixedOrMetricControl_spec.jsx       |  4 ++--
 .../components/MetricDefinitionOption_spec.jsx     |  2 +-
 .../components/MetricDefinitionValue_spec.jsx      |  6 ++---
 .../explore/components/MetricsControl_spec.jsx     |  6 +++--
 .../components/withAsyncVerification_spec.tsx      |  2 +-
 .../src/explore/components/OptionControls.tsx      |  4 ++--
 .../controls/FilterControl}/AdhocFilter.js         |  4 ++--
 .../{ => FilterControl}/AdhocFilterControl.jsx     | 28 +++++++++++-----------
 .../FilterControl}/AdhocFilterEditPopover.jsx      |  6 ++---
 .../AdhocFilterEditPopoverSimpleTabContent.jsx     | 10 ++++----
 .../AdhocFilterEditPopoverSqlTabContent.jsx        |  6 ++---
 .../FilterControl}/AdhocFilterOption.jsx           | 10 ++++----
 .../FilterControl}/AdhocFilterPopoverTrigger.tsx   |  6 ++---
 .../controls/FilterControl}/adhocFilterType.js     |  4 ++--
 .../components/controls/FixedOrMetricControl.jsx   |  2 +-
 .../controls/MetricControl}/AdhocMetric.js         |  2 +-
 .../MetricControl}/AdhocMetricEditPopover.jsx      |  8 +++----
 .../MetricControl}/AdhocMetricEditPopoverTitle.jsx |  0
 .../MetricControl}/AdhocMetricOption.jsx           | 10 ++++----
 .../MetricControl}/AdhocMetricPopoverTrigger.tsx   |  6 ++---
 .../MetricControl}/AdhocMetricStaticOption.jsx     |  2 +-
 .../MetricControl}/FilterDefinitionOption.jsx      |  4 ++--
 .../MetricControl}/MetricDefinitionOption.jsx      | 10 ++++----
 .../MetricControl}/MetricDefinitionValue.jsx       | 12 +++++-----
 .../{ => MetricControl}/MetricsControl.jsx         | 24 +++++++++----------
 .../controls/MetricControl}/adhocMetricType.js     |  6 ++---
 .../controls/MetricControl}/savedMetricType.js     |  0
 .../controls/MetricControl}/types.ts               |  0
 .../src/explore/components/controls/index.js       |  4 ++--
 41 files changed, 130 insertions(+), 120 deletions(-)

diff --git a/superset-frontend/spec/javascripts/explore/AdhocFilter_spec.js b/superset-frontend/spec/javascripts/explore/AdhocFilter_spec.js
index 9b119e8..90dcdf0 100644
--- a/superset-frontend/spec/javascripts/explore/AdhocFilter_spec.js
+++ b/superset-frontend/spec/javascripts/explore/AdhocFilter_spec.js
@@ -19,7 +19,7 @@
 import AdhocFilter, {
   EXPRESSION_TYPES,
   CLAUSES,
-} from 'src/explore/AdhocFilter';
+} from 'src/explore/components/controls/FilterControl/AdhocFilter';
 
 describe('AdhocFilter', () => {
   it('sets filterOptionName in constructor', () => {
diff --git a/superset-frontend/spec/javascripts/explore/AdhocMetric_spec.js b/superset-frontend/spec/javascripts/explore/AdhocMetric_spec.js
index 0dbb2d9..f3b7d08 100644
--- a/superset-frontend/spec/javascripts/explore/AdhocMetric_spec.js
+++ b/superset-frontend/spec/javascripts/explore/AdhocMetric_spec.js
@@ -16,8 +16,10 @@
  * specific language governing permissions and limitations
  * under the License.
  */
-import AdhocMetric, { EXPRESSION_TYPES } from 'src/explore/AdhocMetric';
 import { AGGREGATES } from 'src/explore/constants';
+import AdhocMetric, {
+  EXPRESSION_TYPES,
+} from 'src/explore/components/controls/MetricControl/AdhocMetric';
 
 const valueColumn = { type: 'DOUBLE', column_name: 'value' };
 
diff --git a/superset-frontend/spec/javascripts/explore/components/AdhocFilterControl_spec.jsx b/superset-frontend/spec/javascripts/explore/components/AdhocFilterControl_spec.jsx
index 94af81c..a22d615 100644
--- a/superset-frontend/spec/javascripts/explore/components/AdhocFilterControl_spec.jsx
+++ b/superset-frontend/spec/javascripts/explore/components/AdhocFilterControl_spec.jsx
@@ -25,11 +25,11 @@ import { supersetTheme } from '@superset-ui/core';
 import AdhocFilter, {
   EXPRESSION_TYPES,
   CLAUSES,
-} from 'src/explore/AdhocFilter';
-import AdhocFilterControl from 'src/explore/components/controls/AdhocFilterControl';
+} from 'src/explore/components/controls/FilterControl/AdhocFilter';
 import { LabelsContainer } from 'src/explore/components/OptionControls';
-import AdhocMetric from 'src/explore/AdhocMetric';
 import { AGGREGATES, OPERATORS } from 'src/explore/constants';
+import AdhocFilterControl from 'src/explore/components/controls/FilterControl/AdhocFilterControl';
+import AdhocMetric from 'src/explore/components/controls/MetricControl/AdhocMetric';
 
 const simpleAdhocFilter = new AdhocFilter({
   expressionType: EXPRESSION_TYPES.SIMPLE,
diff --git a/superset-frontend/spec/javascripts/explore/components/AdhocFilterEditPopoverSimpleTabContent_spec.jsx b/superset-frontend/spec/javascripts/explore/components/AdhocFilterEditPopoverSimpleTabContent_spec.jsx
index 91e5d37..01a83ca 100644
--- a/superset-frontend/spec/javascripts/explore/components/AdhocFilterEditPopoverSimpleTabContent_spec.jsx
+++ b/superset-frontend/spec/javascripts/explore/components/AdhocFilterEditPopoverSimpleTabContent_spec.jsx
@@ -25,10 +25,10 @@ import { FormGroup } from 'react-bootstrap';
 import AdhocFilter, {
   EXPRESSION_TYPES,
   CLAUSES,
-} from 'src/explore/AdhocFilter';
-import AdhocMetric from 'src/explore/AdhocMetric';
-import AdhocFilterEditPopoverSimpleTabContent from 'src/explore/components/AdhocFilterEditPopoverSimpleTabContent';
+} from 'src/explore/components/controls/FilterControl/AdhocFilter';
 import { AGGREGATES } from 'src/explore/constants';
+import AdhocFilterEditPopoverSimpleTabContent from 'src/explore/components/controls/FilterControl/AdhocFilterEditPopoverSimpleTabContent';
+import AdhocMetric from 'src/explore/components/controls/MetricControl/AdhocMetric';
 
 const simpleAdhocFilter = new AdhocFilter({
   expressionType: EXPRESSION_TYPES.SIMPLE,
diff --git a/superset-frontend/spec/javascripts/explore/components/AdhocFilterEditPopoverSqlTabContent_spec.jsx b/superset-frontend/spec/javascripts/explore/components/AdhocFilterEditPopoverSqlTabContent_spec.jsx
index 57f0a8b..e0da5e0 100644
--- a/superset-frontend/spec/javascripts/explore/components/AdhocFilterEditPopoverSqlTabContent_spec.jsx
+++ b/superset-frontend/spec/javascripts/explore/components/AdhocFilterEditPopoverSqlTabContent_spec.jsx
@@ -25,8 +25,8 @@ import { FormGroup } from 'react-bootstrap';
 import AdhocFilter, {
   EXPRESSION_TYPES,
   CLAUSES,
-} from 'src/explore/AdhocFilter';
-import AdhocFilterEditPopoverSqlTabContent from 'src/explore/components/AdhocFilterEditPopoverSqlTabContent';
+} from 'src/explore/components/controls/FilterControl/AdhocFilter';
+import AdhocFilterEditPopoverSqlTabContent from 'src/explore/components/controls/FilterControl/AdhocFilterEditPopoverSqlTabContent';
 
 const sqlAdhocFilter = new AdhocFilter({
   expressionType: EXPRESSION_TYPES.SQL,
diff --git a/superset-frontend/spec/javascripts/explore/components/AdhocFilterEditPopover_spec.jsx b/superset-frontend/spec/javascripts/explore/components/AdhocFilterEditPopover_spec.jsx
index 51ad246..492b112 100644
--- a/superset-frontend/spec/javascripts/explore/components/AdhocFilterEditPopover_spec.jsx
+++ b/superset-frontend/spec/javascripts/explore/components/AdhocFilterEditPopover_spec.jsx
@@ -27,12 +27,12 @@ import Tabs from 'src/common/components/Tabs';
 import AdhocFilter, {
   EXPRESSION_TYPES,
   CLAUSES,
-} from 'src/explore/AdhocFilter';
-import AdhocMetric from 'src/explore/AdhocMetric';
-import AdhocFilterEditPopover from 'src/explore/components/AdhocFilterEditPopover';
-import AdhocFilterEditPopoverSimpleTabContent from 'src/explore/components/AdhocFilterEditPopoverSimpleTabContent';
-import AdhocFilterEditPopoverSqlTabContent from 'src/explore/components/AdhocFilterEditPopoverSqlTabContent';
+} from 'src/explore/components/controls/FilterControl/AdhocFilter';
 import { AGGREGATES } from 'src/explore/constants';
+import AdhocFilterEditPopover from 'src/explore/components/controls/FilterControl/AdhocFilterEditPopover';
+import AdhocFilterEditPopoverSimpleTabContent from 'src/explore/components/controls/FilterControl/AdhocFilterEditPopoverSimpleTabContent';
+import AdhocFilterEditPopoverSqlTabContent from 'src/explore/components/controls/FilterControl/AdhocFilterEditPopoverSqlTabContent';
+import AdhocMetric from 'src/explore/components/controls/MetricControl/AdhocMetric';
 
 const simpleAdhocFilter = new AdhocFilter({
   expressionType: EXPRESSION_TYPES.SIMPLE,
diff --git a/superset-frontend/spec/javascripts/explore/components/AdhocFilterOption_spec.jsx b/superset-frontend/spec/javascripts/explore/components/AdhocFilterOption_spec.jsx
index 781f221..c76937e 100644
--- a/superset-frontend/spec/javascripts/explore/components/AdhocFilterOption_spec.jsx
+++ b/superset-frontend/spec/javascripts/explore/components/AdhocFilterOption_spec.jsx
@@ -25,8 +25,8 @@ import Popover from 'src/common/components/Popover';
 import AdhocFilter, {
   EXPRESSION_TYPES,
   CLAUSES,
-} from 'src/explore/AdhocFilter';
-import AdhocFilterOption from 'src/explore/components/AdhocFilterOption';
+} from 'src/explore/components/controls/FilterControl/AdhocFilter';
+import AdhocFilterOption from 'src/explore/components/controls/FilterControl/AdhocFilterOption';
 
 const simpleAdhocFilter = new AdhocFilter({
   expressionType: EXPRESSION_TYPES.SIMPLE,
diff --git a/superset-frontend/spec/javascripts/explore/components/AdhocMetricEditPopoverTitle_spec.jsx b/superset-frontend/spec/javascripts/explore/components/AdhocMetricEditPopoverTitle_spec.jsx
index 9d9bbe2..be02d6b 100644
--- a/superset-frontend/spec/javascripts/explore/components/AdhocMetricEditPopoverTitle_spec.jsx
+++ b/superset-frontend/spec/javascripts/explore/components/AdhocMetricEditPopoverTitle_spec.jsx
@@ -22,7 +22,7 @@ import sinon from 'sinon';
 import { shallow } from 'enzyme';
 import { Tooltip } from 'src/common/components/Tooltip';
 
-import AdhocMetricEditPopoverTitle from 'src/explore/components/AdhocMetricEditPopoverTitle';
+import AdhocMetricEditPopoverTitle from 'src/explore/components/controls/MetricControl/AdhocMetricEditPopoverTitle';
 
 const title = {
   label: 'Title',
diff --git a/superset-frontend/spec/javascripts/explore/components/AdhocMetricEditPopover_spec.jsx b/superset-frontend/spec/javascripts/explore/components/AdhocMetricEditPopover_spec.jsx
index d026c2b..59bc07c 100644
--- a/superset-frontend/spec/javascripts/explore/components/AdhocMetricEditPopover_spec.jsx
+++ b/superset-frontend/spec/javascripts/explore/components/AdhocMetricEditPopover_spec.jsx
@@ -23,9 +23,11 @@ import { shallow } from 'enzyme';
 import { FormGroup } from 'react-bootstrap';
 import Button from 'src/components/Button';
 
-import AdhocMetric, { EXPRESSION_TYPES } from 'src/explore/AdhocMetric';
-import AdhocMetricEditPopover from 'src/explore/components/AdhocMetricEditPopover';
 import { AGGREGATES } from 'src/explore/constants';
+import AdhocMetricEditPopover from 'src/explore/components/controls/MetricControl/AdhocMetricEditPopover';
+import AdhocMetric, {
+  EXPRESSION_TYPES,
+} from 'src/explore/components/controls/MetricControl/AdhocMetric';
 
 const columns = [
   { type: 'VARCHAR(255)', column_name: 'source', id: 1 },
diff --git a/superset-frontend/spec/javascripts/explore/components/AdhocMetricOption_spec.jsx b/superset-frontend/spec/javascripts/explore/components/AdhocMetricOption_spec.jsx
index ceef77d..559520f 100644
--- a/superset-frontend/spec/javascripts/explore/components/AdhocMetricOption_spec.jsx
+++ b/superset-frontend/spec/javascripts/explore/components/AdhocMetricOption_spec.jsx
@@ -22,9 +22,9 @@ import sinon from 'sinon';
 import { shallow } from 'enzyme';
 
 import Popover from 'src/common/components/Popover';
-import AdhocMetric from 'src/explore/AdhocMetric';
-import AdhocMetricOption from 'src/explore/components/AdhocMetricOption';
 import { AGGREGATES } from 'src/explore/constants';
+import AdhocMetricOption from 'src/explore/components/controls/MetricControl/AdhocMetricOption';
+import AdhocMetric from 'src/explore/components/controls/MetricControl/AdhocMetric';
 
 const columns = [
   { type: 'VARCHAR(255)', column_name: 'source' },
diff --git a/superset-frontend/spec/javascripts/explore/components/AdhocMetricStaticOption_spec.jsx b/superset-frontend/spec/javascripts/explore/components/AdhocMetricStaticOption_spec.jsx
index 7d3b926..cba7178 100644
--- a/superset-frontend/spec/javascripts/explore/components/AdhocMetricStaticOption_spec.jsx
+++ b/superset-frontend/spec/javascripts/explore/components/AdhocMetricStaticOption_spec.jsx
@@ -20,9 +20,11 @@
 import React from 'react';
 import { shallow } from 'enzyme';
 
-import AdhocMetricStaticOption from 'src/explore/components/AdhocMetricStaticOption';
-import AdhocMetric, { EXPRESSION_TYPES } from 'src/explore/AdhocMetric';
 import { AGGREGATES } from 'src/explore/constants';
+import AdhocMetricStaticOption from 'src/explore/components/controls/MetricControl/AdhocMetricStaticOption';
+import AdhocMetric, {
+  EXPRESSION_TYPES,
+} from 'src/explore/components/controls/MetricControl/AdhocMetric';
 
 const sumValueAdhocMetric = new AdhocMetric({
   expressionType: EXPRESSION_TYPES.SIMPLE,
diff --git a/superset-frontend/spec/javascripts/explore/components/FilterDefinitionOption_spec.jsx b/superset-frontend/spec/javascripts/explore/components/FilterDefinitionOption_spec.jsx
index fbdb712..f12212f 100644
--- a/superset-frontend/spec/javascripts/explore/components/FilterDefinitionOption_spec.jsx
+++ b/superset-frontend/spec/javascripts/explore/components/FilterDefinitionOption_spec.jsx
@@ -21,10 +21,12 @@ import React from 'react';
 import { shallow } from 'enzyme';
 
 import { ColumnOption } from '@superset-ui/chart-controls';
-import FilterDefinitionOption from 'src/explore/components/FilterDefinitionOption';
-import AdhocMetricStaticOption from 'src/explore/components/AdhocMetricStaticOption';
-import AdhocMetric, { EXPRESSION_TYPES } from 'src/explore/AdhocMetric';
+import FilterDefinitionOption from 'src/explore/components/controls/MetricControl/FilterDefinitionOption';
+import AdhocMetricStaticOption from 'src/explore/components/controls/MetricControl/AdhocMetricStaticOption';
 import { AGGREGATES } from 'src/explore/constants';
+import AdhocMetric, {
+  EXPRESSION_TYPES,
+} from 'src/explore/components/controls/MetricControl/AdhocMetric';
 
 const sumValueAdhocMetric = new AdhocMetric({
   expressionType: EXPRESSION_TYPES.SIMPLE,
diff --git a/superset-frontend/spec/javascripts/explore/components/FixedOrMetricControl_spec.jsx b/superset-frontend/spec/javascripts/explore/components/FixedOrMetricControl_spec.jsx
index 3ad9a3c..dae156c 100644
--- a/superset-frontend/spec/javascripts/explore/components/FixedOrMetricControl_spec.jsx
+++ b/superset-frontend/spec/javascripts/explore/components/FixedOrMetricControl_spec.jsx
@@ -20,9 +20,9 @@
 import React from 'react';
 import { shallow } from 'enzyme';
 
-import FixedOrMetricControl from 'src/explore/components/controls/FixedOrMetricControl';
 import TextControl from 'src/explore/components/controls/TextControl';
-import MetricsControl from 'src/explore/components/controls/MetricsControl';
+import FixedOrMetricControl from 'src/explore/components/controls/FixedOrMetricControl';
+import MetricsControl from 'src/explore/components/controls/MetricControl/MetricsControl';
 
 const defaultProps = {
   value: {},
diff --git a/superset-frontend/spec/javascripts/explore/components/MetricDefinitionOption_spec.jsx b/superset-frontend/spec/javascripts/explore/components/MetricDefinitionOption_spec.jsx
index b626674..d1a93df 100644
--- a/superset-frontend/spec/javascripts/explore/components/MetricDefinitionOption_spec.jsx
+++ b/superset-frontend/spec/javascripts/explore/components/MetricDefinitionOption_spec.jsx
@@ -21,7 +21,7 @@ import configureStore from 'redux-mock-store';
 import { shallow } from 'enzyme';
 import { ColumnOption, MetricOption } from '@superset-ui/chart-controls';
 
-import MetricDefinitionOption from 'src/explore/components/MetricDefinitionOption';
+import MetricDefinitionOption from 'src/explore/components/controls/MetricControl/MetricDefinitionOption';
 import AggregateOption from 'src/explore/components/AggregateOption';
 
 describe('MetricDefinitionOption', () => {
diff --git a/superset-frontend/spec/javascripts/explore/components/MetricDefinitionValue_spec.jsx b/superset-frontend/spec/javascripts/explore/components/MetricDefinitionValue_spec.jsx
index 9e22795..f2e038e 100644
--- a/superset-frontend/spec/javascripts/explore/components/MetricDefinitionValue_spec.jsx
+++ b/superset-frontend/spec/javascripts/explore/components/MetricDefinitionValue_spec.jsx
@@ -20,10 +20,10 @@
 import React from 'react';
 import { shallow } from 'enzyme';
 
-import MetricDefinitionValue from 'src/explore/components/MetricDefinitionValue';
-import AdhocMetricOption from 'src/explore/components/AdhocMetricOption';
-import AdhocMetric from 'src/explore/AdhocMetric';
 import { AGGREGATES } from 'src/explore/constants';
+import MetricDefinitionValue from 'src/explore/components/controls/MetricControl/MetricDefinitionValue';
+import AdhocMetricOption from 'src/explore/components/controls/MetricControl/AdhocMetricOption';
+import AdhocMetric from 'src/explore/components/controls/MetricControl/AdhocMetric';
 
 const sumValueAdhocMetric = new AdhocMetric({
   column: { type: 'DOUBLE', column_name: 'value' },
diff --git a/superset-frontend/spec/javascripts/explore/components/MetricsControl_spec.jsx b/superset-frontend/spec/javascripts/explore/components/MetricsControl_spec.jsx
index 638a20e..825b57e 100644
--- a/superset-frontend/spec/javascripts/explore/components/MetricsControl_spec.jsx
+++ b/superset-frontend/spec/javascripts/explore/components/MetricsControl_spec.jsx
@@ -21,11 +21,13 @@ import React from 'react';
 import sinon from 'sinon';
 import { shallow } from 'enzyme';
 
-import MetricsControl from 'src/explore/components/controls/MetricsControl';
 import { AGGREGATES } from 'src/explore/constants';
-import AdhocMetric, { EXPRESSION_TYPES } from 'src/explore/AdhocMetric';
 import { LabelsContainer } from 'src/explore/components/OptionControls';
 import { supersetTheme } from '@superset-ui/core';
+import MetricsControl from 'src/explore/components/controls/MetricControl/MetricsControl';
+import AdhocMetric, {
+  EXPRESSION_TYPES,
+} from 'src/explore/components/controls/MetricControl/AdhocMetric';
 
 const defaultProps = {
   name: 'metrics',
diff --git a/superset-frontend/spec/javascripts/explore/components/withAsyncVerification_spec.tsx b/superset-frontend/spec/javascripts/explore/components/withAsyncVerification_spec.tsx
index 35292ba..355f81c 100644
--- a/superset-frontend/spec/javascripts/explore/components/withAsyncVerification_spec.tsx
+++ b/superset-frontend/spec/javascripts/explore/components/withAsyncVerification_spec.tsx
@@ -21,12 +21,12 @@ import { ReactWrapper } from 'enzyme';
 import { styledMount as mount } from 'spec/helpers/theming';
 import { act } from 'react-dom/test-utils';
 
-import MetricsControl from 'src/explore/components/controls/MetricsControl';
 import withAsyncVerification, {
   ControlPropsWithExtras,
   WithAsyncVerificationOptions,
 } from 'src/explore/components/controls/withAsyncVerification';
 import { ExtraControlProps } from '@superset-ui/chart-controls';
+import MetricsControl from 'src/explore/components/controls/MetricControl/MetricsControl';
 
 const VALID_METRIC = {
   metric_name: 'sum__value',
diff --git a/superset-frontend/src/explore/components/OptionControls.tsx b/superset-frontend/src/explore/components/OptionControls.tsx
index 8d157c8..c822b32 100644
--- a/superset-frontend/src/explore/components/OptionControls.tsx
+++ b/superset-frontend/src/explore/components/OptionControls.tsx
@@ -24,8 +24,8 @@ import { findDOMNode } from 'react-dom';
 import { DragSource, DropTarget } from 'react-dnd';
 import { styled, useTheme } from '@superset-ui/core';
 import { ColumnOption } from '@superset-ui/chart-controls';
-import Icon from '../../components/Icon';
-import { savedMetricType } from '../types';
+import Icon from 'src/components/Icon';
+import { savedMetricType } from 'src/explore/components/controls/MetricControl/types';
 
 const TYPE = 'label-dnd';
 
diff --git a/superset-frontend/src/explore/AdhocFilter.js b/superset-frontend/src/explore/components/controls/FilterControl/AdhocFilter.js
similarity index 97%
rename from superset-frontend/src/explore/AdhocFilter.js
rename to superset-frontend/src/explore/components/controls/FilterControl/AdhocFilter.js
index 22e70c8..09fde0a 100644
--- a/superset-frontend/src/explore/AdhocFilter.js
+++ b/superset-frontend/src/explore/components/controls/FilterControl/AdhocFilter.js
@@ -16,8 +16,8 @@
  * specific language governing permissions and limitations
  * under the License.
  */
-import { CUSTOM_OPERATORS } from './constants';
-import { getSimpleSQLExpression } from './exploreUtils';
+import { CUSTOM_OPERATORS } from 'src/explore/constants';
+import { getSimpleSQLExpression } from 'src/explore/exploreUtils';
 
 export const EXPRESSION_TYPES = {
   SIMPLE: 'SIMPLE',
diff --git a/superset-frontend/src/explore/components/controls/AdhocFilterControl.jsx b/superset-frontend/src/explore/components/controls/FilterControl/AdhocFilterControl.jsx
similarity index 91%
rename from superset-frontend/src/explore/components/controls/AdhocFilterControl.jsx
rename to superset-frontend/src/explore/components/controls/FilterControl/AdhocFilterControl.jsx
index f5c9f5d..bad9bba 100644
--- a/superset-frontend/src/explore/components/controls/AdhocFilterControl.jsx
+++ b/superset-frontend/src/explore/components/controls/FilterControl/AdhocFilterControl.jsx
@@ -20,25 +20,25 @@ import React from 'react';
 import PropTypes from 'prop-types';
 import { t, logging, SupersetClient, withTheme } from '@superset-ui/core';
 
-import ControlHeader from '../ControlHeader';
-import adhocFilterType from '../../propTypes/adhocFilterType';
-import adhocMetricType from '../../propTypes/adhocMetricType';
-import savedMetricType from '../../propTypes/savedMetricType';
-import columnType from '../../propTypes/columnType';
-import AdhocFilter, { CLAUSES, EXPRESSION_TYPES } from '../../AdhocFilter';
-import AdhocMetric from '../../AdhocMetric';
-import { OPERATORS } from '../../constants';
-import AdhocFilterOption from '../AdhocFilterOption';
-import FilterDefinitionOption from '../FilterDefinitionOption';
+import ControlHeader from 'src/explore/components/ControlHeader';
+import adhocMetricType from 'src/explore/components/controls/MetricControl/adhocMetricType';
+import savedMetricType from 'src/explore/components/controls/MetricControl/savedMetricType';
+import columnType from 'src/explore/propTypes/columnType';
+import AdhocMetric from 'src/explore/components/controls/MetricControl/AdhocMetric';
+import { OPERATORS } from 'src/explore/constants';
+import FilterDefinitionOption from 'src/explore/components/controls/MetricControl/FilterDefinitionOption';
 import {
   AddControlLabel,
   AddIconButton,
   HeaderContainer,
   LabelsContainer,
-} from '../OptionControls';
-import Icon from '../../../components/Icon';
-import AdhocFilterPopoverTrigger from '../AdhocFilterPopoverTrigger';
-import DndWithHTML5Backend from '../../DndContextProvider';
+} from 'src/explore/components/OptionControls';
+import Icon from 'src/components/Icon';
+import DndWithHTML5Backend from 'src/explore/DndContextProvider';
+import AdhocFilterPopoverTrigger from './AdhocFilterPopoverTrigger';
+import AdhocFilterOption from './AdhocFilterOption';
+import AdhocFilter, { CLAUSES, EXPRESSION_TYPES } from './AdhocFilter';
+import adhocFilterType from './adhocFilterType';
 
 const propTypes = {
   name: PropTypes.string,
diff --git a/superset-frontend/src/explore/components/AdhocFilterEditPopover.jsx b/superset-frontend/src/explore/components/controls/FilterControl/AdhocFilterEditPopover.jsx
similarity index 96%
rename from superset-frontend/src/explore/components/AdhocFilterEditPopover.jsx
rename to superset-frontend/src/explore/components/controls/FilterControl/AdhocFilterEditPopover.jsx
index 005d437..b1d47ef 100644
--- a/superset-frontend/src/explore/components/AdhocFilterEditPopover.jsx
+++ b/superset-frontend/src/explore/components/controls/FilterControl/AdhocFilterEditPopover.jsx
@@ -23,9 +23,9 @@ import { styled, t } from '@superset-ui/core';
 
 import ErrorBoundary from 'src/components/ErrorBoundary';
 import Tabs from 'src/common/components/Tabs';
-import columnType from '../propTypes/columnType';
-import adhocMetricType from '../propTypes/adhocMetricType';
-import AdhocFilter, { EXPRESSION_TYPES } from '../AdhocFilter';
+import columnType from 'src/explore/propTypes/columnType';
+import adhocMetricType from 'src/explore/components/controls/MetricControl/adhocMetricType';
+import AdhocFilter, { EXPRESSION_TYPES } from './AdhocFilter';
 import AdhocFilterEditPopoverSimpleTabContent from './AdhocFilterEditPopoverSimpleTabContent';
 import AdhocFilterEditPopoverSqlTabContent from './AdhocFilterEditPopoverSqlTabContent';
 
diff --git a/superset-frontend/src/explore/components/AdhocFilterEditPopoverSimpleTabContent.jsx b/superset-frontend/src/explore/components/controls/FilterControl/AdhocFilterEditPopoverSimpleTabContent.jsx
similarity index 97%
rename from superset-frontend/src/explore/components/AdhocFilterEditPopoverSimpleTabContent.jsx
rename to superset-frontend/src/explore/components/controls/FilterControl/AdhocFilterEditPopoverSimpleTabContent.jsx
index 5856bfa..dbec5e6 100644
--- a/superset-frontend/src/explore/components/AdhocFilterEditPopoverSimpleTabContent.jsx
+++ b/superset-frontend/src/explore/components/controls/FilterControl/AdhocFilterEditPopoverSimpleTabContent.jsx
@@ -23,9 +23,8 @@ import { Select } from 'src/common/components/Select';
 import { Input } from 'src/common/components';
 import { t, SupersetClient, styled } from '@superset-ui/core';
 
-import AdhocFilter, { EXPRESSION_TYPES, CLAUSES } from '../AdhocFilter';
-import adhocMetricType from '../propTypes/adhocMetricType';
-import columnType from '../propTypes/columnType';
+import adhocMetricType from 'src/explore/components/controls/MetricControl/adhocMetricType';
+import columnType from 'src/explore/propTypes/columnType';
 import {
   OPERATORS,
   OPERATORS_OPTIONS,
@@ -35,8 +34,9 @@ import {
   MULTI_OPERATORS,
   CUSTOM_OPERATORS,
   DISABLE_INPUT_OPERATORS,
-} from '../constants';
-import FilterDefinitionOption from './FilterDefinitionOption';
+} from 'src/explore/constants';
+import FilterDefinitionOption from 'src/explore/components/controls/MetricControl/FilterDefinitionOption';
+import AdhocFilter, { EXPRESSION_TYPES, CLAUSES } from './AdhocFilter';
 
 const SelectWithLabel = styled(Select)`
   .ant-select-selector::after {
diff --git a/superset-frontend/src/explore/components/AdhocFilterEditPopoverSqlTabContent.jsx b/superset-frontend/src/explore/components/controls/FilterControl/AdhocFilterEditPopoverSqlTabContent.jsx
similarity index 95%
rename from superset-frontend/src/explore/components/AdhocFilterEditPopoverSqlTabContent.jsx
rename to superset-frontend/src/explore/components/controls/FilterControl/AdhocFilterEditPopoverSqlTabContent.jsx
index ffd0175..7841d88 100644
--- a/superset-frontend/src/explore/components/AdhocFilterEditPopoverSqlTabContent.jsx
+++ b/superset-frontend/src/explore/components/controls/FilterControl/AdhocFilterEditPopoverSqlTabContent.jsx
@@ -24,9 +24,9 @@ import { t } from '@superset-ui/core';
 import { SQLEditor } from 'src/components/AsyncAceEditor';
 import sqlKeywords from 'src/SqlLab/utils/sqlKeywords';
 
-import AdhocFilter, { EXPRESSION_TYPES, CLAUSES } from '../AdhocFilter';
-import adhocMetricType from '../propTypes/adhocMetricType';
-import columnType from '../propTypes/columnType';
+import adhocMetricType from 'src/explore/components/controls/MetricControl/adhocMetricType';
+import columnType from 'src/explore/propTypes/columnType';
+import AdhocFilter, { EXPRESSION_TYPES, CLAUSES } from './AdhocFilter';
 
 const propTypes = {
   adhocFilter: PropTypes.instanceOf(AdhocFilter).isRequired,
diff --git a/superset-frontend/src/explore/components/AdhocFilterOption.jsx b/superset-frontend/src/explore/components/controls/FilterControl/AdhocFilterOption.jsx
similarity index 86%
rename from superset-frontend/src/explore/components/AdhocFilterOption.jsx
rename to superset-frontend/src/explore/components/controls/FilterControl/AdhocFilterOption.jsx
index a6b26c5..954bb8a 100644
--- a/superset-frontend/src/explore/components/AdhocFilterOption.jsx
+++ b/superset-frontend/src/explore/components/controls/FilterControl/AdhocFilterOption.jsx
@@ -18,12 +18,12 @@
  */
 import React from 'react';
 import PropTypes from 'prop-types';
-import AdhocFilter from '../AdhocFilter';
-import columnType from '../propTypes/columnType';
-import adhocMetricType from '../propTypes/adhocMetricType';
+import columnType from 'src/explore/propTypes/columnType';
+import adhocMetricType from 'src/explore/components/controls/MetricControl/adhocMetricType';
+import { DraggableOptionControlLabel } from 'src/explore/components/OptionControls';
+import { OPTION_TYPES } from 'src/explore/components/optionTypes';
 import AdhocFilterPopoverTrigger from './AdhocFilterPopoverTrigger';
-import { DraggableOptionControlLabel } from './OptionControls';
-import { OPTION_TYPES } from './optionTypes';
+import AdhocFilter from './AdhocFilter';
 
 const propTypes = {
   adhocFilter: PropTypes.instanceOf(AdhocFilter).isRequired,
diff --git a/superset-frontend/src/explore/components/AdhocFilterPopoverTrigger.tsx b/superset-frontend/src/explore/components/controls/FilterControl/AdhocFilterPopoverTrigger.tsx
similarity index 94%
rename from superset-frontend/src/explore/components/AdhocFilterPopoverTrigger.tsx
rename to superset-frontend/src/explore/components/controls/FilterControl/AdhocFilterPopoverTrigger.tsx
index ce2fddf..ceab93b 100644
--- a/superset-frontend/src/explore/components/AdhocFilterPopoverTrigger.tsx
+++ b/superset-frontend/src/explore/components/controls/FilterControl/AdhocFilterPopoverTrigger.tsx
@@ -21,10 +21,10 @@ import { t } from '@superset-ui/core';
 import { InfoTooltipWithTrigger } from '@superset-ui/chart-controls';
 
 import Popover from 'src/common/components/Popover';
+import columnType from 'src/explore/propTypes/columnType';
+import adhocMetricType from 'src/explore/components/controls/MetricControl/adhocMetricType';
 import AdhocFilterEditPopover from './AdhocFilterEditPopover';
-import AdhocFilter from '../AdhocFilter';
-import columnType from '../propTypes/columnType';
-import adhocMetricType from '../propTypes/adhocMetricType';
+import AdhocFilter from './AdhocFilter';
 
 interface AdhocFilterPopoverTriggerProps {
   adhocFilter: AdhocFilter;
diff --git a/superset-frontend/src/explore/propTypes/adhocFilterType.js b/superset-frontend/src/explore/components/controls/FilterControl/adhocFilterType.js
similarity index 93%
rename from superset-frontend/src/explore/propTypes/adhocFilterType.js
rename to superset-frontend/src/explore/components/controls/FilterControl/adhocFilterType.js
index 9bc1b94..f036fc0 100644
--- a/superset-frontend/src/explore/propTypes/adhocFilterType.js
+++ b/superset-frontend/src/explore/components/controls/FilterControl/adhocFilterType.js
@@ -18,8 +18,8 @@
  */
 import PropTypes from 'prop-types';
 
-import { OPERATORS } from '../constants';
-import { EXPRESSION_TYPES, CLAUSES } from '../AdhocFilter';
+import { OPERATORS } from 'src/explore/constants';
+import { EXPRESSION_TYPES, CLAUSES } from './AdhocFilter';
 
 export default PropTypes.oneOfType([
   PropTypes.shape({
diff --git a/superset-frontend/src/explore/components/controls/FixedOrMetricControl.jsx b/superset-frontend/src/explore/components/controls/FixedOrMetricControl.jsx
index d7cf050..d95df79 100644
--- a/superset-frontend/src/explore/components/controls/FixedOrMetricControl.jsx
+++ b/superset-frontend/src/explore/components/controls/FixedOrMetricControl.jsx
@@ -22,7 +22,7 @@ import { Panel } from 'react-bootstrap';
 
 import Label from 'src/components/Label';
 import TextControl from './TextControl';
-import MetricsControl from './MetricsControl';
+import MetricsControl from './MetricControl/MetricsControl';
 import ControlHeader from '../ControlHeader';
 import PopoverSection from '../../../components/PopoverSection';
 
diff --git a/superset-frontend/src/explore/AdhocMetric.js b/superset-frontend/src/explore/components/controls/MetricControl/AdhocMetric.js
similarity index 98%
rename from superset-frontend/src/explore/AdhocMetric.js
rename to superset-frontend/src/explore/components/controls/MetricControl/AdhocMetric.js
index 24b18da..f5a4885 100644
--- a/superset-frontend/src/explore/AdhocMetric.js
+++ b/superset-frontend/src/explore/components/controls/MetricControl/AdhocMetric.js
@@ -16,7 +16,7 @@
  * specific language governing permissions and limitations
  * under the License.
  */
-import { sqlaAutoGeneratedMetricRegex } from './constants';
+import { sqlaAutoGeneratedMetricRegex } from 'src/explore/constants';
 
 export const EXPRESSION_TYPES = {
   SIMPLE: 'SIMPLE',
diff --git a/superset-frontend/src/explore/components/AdhocMetricEditPopover.jsx b/superset-frontend/src/explore/components/controls/MetricControl/AdhocMetricEditPopover.jsx
similarity index 98%
rename from superset-frontend/src/explore/components/AdhocMetricEditPopover.jsx
rename to superset-frontend/src/explore/components/controls/MetricControl/AdhocMetricEditPopover.jsx
index a6218b3..bfe8391 100644
--- a/superset-frontend/src/explore/components/AdhocMetricEditPopover.jsx
+++ b/superset-frontend/src/explore/components/controls/MetricControl/AdhocMetricEditPopover.jsx
@@ -30,10 +30,10 @@ import FormLabel from 'src/components/FormLabel';
 import { SQLEditor } from 'src/components/AsyncAceEditor';
 import sqlKeywords from 'src/SqlLab/utils/sqlKeywords';
 
-import { AGGREGATES_OPTIONS } from '../constants';
-import columnType from '../propTypes/columnType';
-import savedMetricType from '../propTypes/savedMetricType';
-import AdhocMetric, { EXPRESSION_TYPES } from '../AdhocMetric';
+import { AGGREGATES_OPTIONS } from 'src/explore/constants';
+import columnType from 'src/explore/propTypes/columnType';
+import savedMetricType from './savedMetricType';
+import AdhocMetric, { EXPRESSION_TYPES } from './AdhocMetric';
 
 const propTypes = {
   adhocMetric: PropTypes.instanceOf(AdhocMetric).isRequired,
diff --git a/superset-frontend/src/explore/components/AdhocMetricEditPopoverTitle.jsx b/superset-frontend/src/explore/components/controls/MetricControl/AdhocMetricEditPopoverTitle.jsx
similarity index 100%
rename from superset-frontend/src/explore/components/AdhocMetricEditPopoverTitle.jsx
rename to superset-frontend/src/explore/components/controls/MetricControl/AdhocMetricEditPopoverTitle.jsx
diff --git a/superset-frontend/src/explore/components/AdhocMetricOption.jsx b/superset-frontend/src/explore/components/controls/MetricControl/AdhocMetricOption.jsx
similarity index 90%
rename from superset-frontend/src/explore/components/AdhocMetricOption.jsx
rename to superset-frontend/src/explore/components/controls/MetricControl/AdhocMetricOption.jsx
index 77eab7c..a43d93f 100644
--- a/superset-frontend/src/explore/components/AdhocMetricOption.jsx
+++ b/superset-frontend/src/explore/components/controls/MetricControl/AdhocMetricOption.jsx
@@ -19,12 +19,12 @@
 import React from 'react';
 import PropTypes from 'prop-types';
 import { Tooltip } from 'src/common/components/Tooltip';
-import AdhocMetric from '../AdhocMetric';
-import columnType from '../propTypes/columnType';
-import savedMetricType from '../propTypes/savedMetricType';
-import { DraggableOptionControlLabel } from './OptionControls';
+import columnType from 'src/explore/propTypes/columnType';
+import { DraggableOptionControlLabel } from 'src/explore/components/OptionControls';
+import { OPTION_TYPES } from 'src/explore/components/optionTypes';
+import AdhocMetric from './AdhocMetric';
+import savedMetricType from './savedMetricType';
 import AdhocMetricPopoverTrigger from './AdhocMetricPopoverTrigger';
-import { OPTION_TYPES } from './optionTypes';
 
 const propTypes = {
   adhocMetric: PropTypes.instanceOf(AdhocMetric),
diff --git a/superset-frontend/src/explore/components/AdhocMetricPopoverTrigger.tsx b/superset-frontend/src/explore/components/controls/MetricControl/AdhocMetricPopoverTrigger.tsx
similarity index 96%
rename from superset-frontend/src/explore/components/AdhocMetricPopoverTrigger.tsx
rename to superset-frontend/src/explore/components/controls/MetricControl/AdhocMetricPopoverTrigger.tsx
index 6179816..649d3fe 100644
--- a/superset-frontend/src/explore/components/AdhocMetricPopoverTrigger.tsx
+++ b/superset-frontend/src/explore/components/controls/MetricControl/AdhocMetricPopoverTrigger.tsx
@@ -18,10 +18,10 @@
  */
 import React, { ReactNode } from 'react';
 import Popover from 'src/common/components/Popover';
-import AdhocMetricEditPopoverTitle from 'src/explore/components/AdhocMetricEditPopoverTitle';
+import AdhocMetricEditPopoverTitle from 'src/explore/components/controls/MetricControl/AdhocMetricEditPopoverTitle';
 import AdhocMetricEditPopover from './AdhocMetricEditPopover';
-import AdhocMetric from '../AdhocMetric';
-import { savedMetricType } from '../types';
+import AdhocMetric from './AdhocMetric';
+import { savedMetricType } from './types';
 
 export type AdhocMetricPopoverTriggerProps = {
   adhocMetric: AdhocMetric;
diff --git a/superset-frontend/src/explore/components/AdhocMetricStaticOption.jsx b/superset-frontend/src/explore/components/controls/MetricControl/AdhocMetricStaticOption.jsx
similarity index 95%
rename from superset-frontend/src/explore/components/AdhocMetricStaticOption.jsx
rename to superset-frontend/src/explore/components/controls/MetricControl/AdhocMetricStaticOption.jsx
index 7c6265c..ee5eed7 100644
--- a/superset-frontend/src/explore/components/AdhocMetricStaticOption.jsx
+++ b/superset-frontend/src/explore/components/controls/MetricControl/AdhocMetricStaticOption.jsx
@@ -20,7 +20,7 @@ import React from 'react';
 import PropTypes from 'prop-types';
 import { ColumnTypeLabel } from '@superset-ui/chart-controls';
 
-import adhocMetricType from '../propTypes/adhocMetricType';
+import adhocMetricType from './adhocMetricType';
 
 const propTypes = {
   adhocMetric: adhocMetricType,
diff --git a/superset-frontend/src/explore/components/FilterDefinitionOption.jsx b/superset-frontend/src/explore/components/controls/MetricControl/FilterDefinitionOption.jsx
similarity index 93%
rename from superset-frontend/src/explore/components/FilterDefinitionOption.jsx
rename to superset-frontend/src/explore/components/controls/MetricControl/FilterDefinitionOption.jsx
index 6fa227d..fd256b4 100644
--- a/superset-frontend/src/explore/components/FilterDefinitionOption.jsx
+++ b/superset-frontend/src/explore/components/controls/MetricControl/FilterDefinitionOption.jsx
@@ -20,9 +20,9 @@ import React from 'react';
 import PropTypes from 'prop-types';
 import { ColumnOption, ColumnTypeLabel } from '@superset-ui/chart-controls';
 
+import columnType from 'src/explore/propTypes/columnType';
 import AdhocMetricStaticOption from './AdhocMetricStaticOption';
-import columnType from '../propTypes/columnType';
-import adhocMetricType from '../propTypes/adhocMetricType';
+import adhocMetricType from './adhocMetricType';
 
 const propTypes = {
   option: PropTypes.oneOfType([
diff --git a/superset-frontend/src/explore/components/MetricDefinitionOption.jsx b/superset-frontend/src/explore/components/controls/MetricControl/MetricDefinitionOption.jsx
similarity index 84%
rename from superset-frontend/src/explore/components/MetricDefinitionOption.jsx
rename to superset-frontend/src/explore/components/controls/MetricControl/MetricDefinitionOption.jsx
index a484e24..91e239d 100644
--- a/superset-frontend/src/explore/components/MetricDefinitionOption.jsx
+++ b/superset-frontend/src/explore/components/controls/MetricControl/MetricDefinitionOption.jsx
@@ -20,11 +20,11 @@ import React from 'react';
 import PropTypes from 'prop-types';
 import { ColumnOption, MetricOption } from '@superset-ui/chart-controls';
 
-import AggregateOption from './AggregateOption';
-import columnType from '../propTypes/columnType';
-import savedMetricType from '../propTypes/savedMetricType';
-import aggregateOptionType from '../propTypes/aggregateOptionType';
-import withToasts from '../../messageToasts/enhancers/withToasts';
+import AggregateOption from 'src/explore/components/AggregateOption';
+import columnType from 'src/explore/propTypes/columnType';
+import aggregateOptionType from 'src/explore/propTypes/aggregateOptionType';
+import withToasts from 'src/messageToasts/enhancers/withToasts';
+import savedMetricType from './savedMetricType';
 
 const propTypes = {
   option: PropTypes.oneOfType([
diff --git a/superset-frontend/src/explore/components/MetricDefinitionValue.jsx b/superset-frontend/src/explore/components/controls/MetricControl/MetricDefinitionValue.jsx
similarity index 88%
rename from superset-frontend/src/explore/components/MetricDefinitionValue.jsx
rename to superset-frontend/src/explore/components/controls/MetricControl/MetricDefinitionValue.jsx
index 1a65da1..5bae01d 100644
--- a/superset-frontend/src/explore/components/MetricDefinitionValue.jsx
+++ b/superset-frontend/src/explore/components/controls/MetricControl/MetricDefinitionValue.jsx
@@ -18,13 +18,13 @@
  */
 import React from 'react';
 import PropTypes from 'prop-types';
+import columnType from 'src/explore/propTypes/columnType';
+import { DraggableOptionControlLabel } from 'src/explore/components/OptionControls';
+import { OPTION_TYPES } from 'src/explore/components/optionTypes';
 import AdhocMetricOption from './AdhocMetricOption';
-import AdhocMetric from '../AdhocMetric';
-import columnType from '../propTypes/columnType';
-import savedMetricType from '../propTypes/savedMetricType';
-import adhocMetricType from '../propTypes/adhocMetricType';
-import { DraggableOptionControlLabel } from './OptionControls';
-import { OPTION_TYPES } from './optionTypes';
+import AdhocMetric from './AdhocMetric';
+import savedMetricType from './savedMetricType';
+import adhocMetricType from './adhocMetricType';
 
 const propTypes = {
   option: PropTypes.oneOfType([savedMetricType, adhocMetricType]).isRequired,
diff --git a/superset-frontend/src/explore/components/controls/MetricsControl.jsx b/superset-frontend/src/explore/components/controls/MetricControl/MetricsControl.jsx
similarity index 94%
rename from superset-frontend/src/explore/components/controls/MetricsControl.jsx
rename to superset-frontend/src/explore/components/controls/MetricControl/MetricsControl.jsx
index f643e2b..83b5c16 100644
--- a/superset-frontend/src/explore/components/controls/MetricsControl.jsx
+++ b/superset-frontend/src/explore/components/controls/MetricControl/MetricsControl.jsx
@@ -20,27 +20,27 @@ import React from 'react';
 import PropTypes from 'prop-types';
 import { t, withTheme } from '@superset-ui/core';
 import { isEqual } from 'lodash';
-import ControlHeader from '../ControlHeader';
-import MetricDefinitionOption from '../MetricDefinitionOption';
-import MetricDefinitionValue from '../MetricDefinitionValue';
-import AdhocMetric from '../../AdhocMetric';
-import columnType from '../../propTypes/columnType';
-import savedMetricType from '../../propTypes/savedMetricType';
-import adhocMetricType from '../../propTypes/adhocMetricType';
+import ControlHeader from 'src/explore/components/ControlHeader';
+import columnType from 'src/explore/propTypes/columnType';
 import {
   AGGREGATES_OPTIONS,
   sqlaAutoGeneratedMetricNameRegex,
   druidAutoGeneratedMetricRegex,
-} from '../../constants';
-import AdhocMetricPopoverTrigger from '../AdhocMetricPopoverTrigger';
-import Icon from '../../../components/Icon';
+} from 'src/explore/constants';
+import Icon from 'src/components/Icon';
 import {
   AddIconButton,
   AddControlLabel,
   HeaderContainer,
   LabelsContainer,
-} from '../OptionControls';
-import DndWithHTML5Backend from '../../DndContextProvider';
+} from 'src/explore/components/OptionControls';
+import DndWithHTML5Backend from 'src/explore/DndContextProvider';
+import MetricDefinitionOption from './MetricDefinitionOption';
+import MetricDefinitionValue from './MetricDefinitionValue';
+import AdhocMetric from './AdhocMetric';
+import savedMetricType from './savedMetricType';
+import adhocMetricType from './adhocMetricType';
+import AdhocMetricPopoverTrigger from './AdhocMetricPopoverTrigger';
 
 const propTypes = {
   name: PropTypes.string.isRequired,
diff --git a/superset-frontend/src/explore/propTypes/adhocMetricType.js b/superset-frontend/src/explore/components/controls/MetricControl/adhocMetricType.js
similarity index 89%
rename from superset-frontend/src/explore/propTypes/adhocMetricType.js
rename to superset-frontend/src/explore/components/controls/MetricControl/adhocMetricType.js
index 5ebf6e4..a03766e 100644
--- a/superset-frontend/src/explore/propTypes/adhocMetricType.js
+++ b/superset-frontend/src/explore/components/controls/MetricControl/adhocMetricType.js
@@ -18,9 +18,9 @@
  */
 import PropTypes from 'prop-types';
 
-import { AGGREGATES } from '../constants';
-import columnType from './columnType';
-import { EXPRESSION_TYPES } from '../AdhocMetric';
+import { AGGREGATES } from 'src/explore/constants';
+import columnType from 'src/explore/propTypes/columnType';
+import { EXPRESSION_TYPES } from './AdhocMetric';
 
 export default PropTypes.oneOfType([
   PropTypes.shape({
diff --git a/superset-frontend/src/explore/propTypes/savedMetricType.js b/superset-frontend/src/explore/components/controls/MetricControl/savedMetricType.js
similarity index 100%
rename from superset-frontend/src/explore/propTypes/savedMetricType.js
rename to superset-frontend/src/explore/components/controls/MetricControl/savedMetricType.js
diff --git a/superset-frontend/src/explore/types.ts b/superset-frontend/src/explore/components/controls/MetricControl/types.ts
similarity index 100%
rename from superset-frontend/src/explore/types.ts
rename to superset-frontend/src/explore/components/controls/MetricControl/types.ts
diff --git a/superset-frontend/src/explore/components/controls/index.js b/superset-frontend/src/explore/components/controls/index.js
index e3714db..ba82c3c 100644
--- a/superset-frontend/src/explore/components/controls/index.js
+++ b/superset-frontend/src/explore/components/controls/index.js
@@ -36,8 +36,8 @@ import TextControl from './TextControl';
 import TimeSeriesColumnControl from './TimeSeriesColumnControl';
 import ViewportControl from './ViewportControl';
 import VizTypeControl from './VizTypeControl';
-import MetricsControl from './MetricsControl';
-import AdhocFilterControl from './AdhocFilterControl';
+import MetricsControl from './MetricControl/MetricsControl';
+import AdhocFilterControl from './FilterControl/AdhocFilterControl';
 import FilterBoxItemControl from './FilterBoxItemControl';
 
 const controlMap = {