chore(metricoption): remove metricoption and columntypelable dependency (#10077)

* remove columntypeLabel and metricoptions from superset

* fix lint

* remove old test

* update pakage

* add suggestions

* fix merge conflict

superset-frontend/package-lock.json

@@ -7776,12 +7776,13 @@
       }
     },
     "@superset-ui/control-utils": {
-      "version": "0.13.27",
+      "version": "0.13.29",
-      "resolved": "https://registry.npmjs.org/@superset-ui/control-utils/-/control-utils-0.13.27.tgz",
+      "resolved": "https://registry.npmjs.org/@superset-ui/control-utils/-/control-utils-0.13.29.tgz",
-      "integrity": "sha512-tM3fcFaHhpZ/6erh/I/PJhcgU/jZhLHJOwLoxvDJDNNabf/M9+2TbwOaK/91buiJadQrkBzAOOgGIjb02UrKLA==",
+      "integrity": "sha512-COfXjB9JPYZlJ+gSDpv00sVGxnrRSV0l4NhIXFhH8KRmu7N8Vr/5sj3X47jQnRV/4TGclRVVEJV9bOYea7Hb+A==",
       "requires": {
         "@types/react-bootstrap": "0.32.21",
         "lodash": "^4.17.15",
+        "prop-types": "^15.7.2",
         "react-bootstrap": "^0.33.1"
       }
     },
@@ -7837,6 +7838,16 @@
         "prop-types": "^15.6.2"
       },
       "dependencies": {
+        "@superset-ui/control-utils": {
+          "version": "0.13.27",
+          "resolved": "https://registry.npmjs.org/@superset-ui/control-utils/-/control-utils-0.13.27.tgz",
+          "integrity": "sha512-tM3fcFaHhpZ/6erh/I/PJhcgU/jZhLHJOwLoxvDJDNNabf/M9+2TbwOaK/91buiJadQrkBzAOOgGIjb02UrKLA==",
+          "requires": {
+            "@types/react-bootstrap": "0.32.21",
+            "lodash": "^4.17.15",
+            "react-bootstrap": "^0.33.1"
+          }
+        },
         "d3-array": {
           "version": "2.4.0",
           "resolved": "https://registry.npmjs.org/d3-array/-/d3-array-2.4.0.tgz",
@@ -8412,6 +8423,16 @@
         "@superset-ui/validator": "0.13.27"
       },
       "dependencies": {
+        "@superset-ui/control-utils": {
+          "version": "0.13.27",
+          "resolved": "https://registry.npmjs.org/@superset-ui/control-utils/-/control-utils-0.13.27.tgz",
+          "integrity": "sha512-tM3fcFaHhpZ/6erh/I/PJhcgU/jZhLHJOwLoxvDJDNNabf/M9+2TbwOaK/91buiJadQrkBzAOOgGIjb02UrKLA==",
+          "requires": {
+            "@types/react-bootstrap": "0.32.21",
+            "lodash": "^4.17.15",
+            "react-bootstrap": "^0.33.1"
+          }
+        },
         "@superset-ui/style": {
           "version": "0.13.27",
           "resolved": "https://registry.npmjs.org/@superset-ui/style/-/style-0.13.27.tgz",

superset-frontend/package.json

@@ -63,7 +63,7 @@
     "@superset-ui/chart-composition": "^0.13.27",
     "@superset-ui/color": "^0.13.27",
     "@superset-ui/connection": "^0.13.27",
-    "@superset-ui/control-utils": "^0.13.27",
+    "@superset-ui/control-utils": "^0.13.28",
     "@superset-ui/core": "^0.13.27",
     "@superset-ui/dimension": "^0.13.27",
     "@superset-ui/legacy-plugin-chart-calendar": "^0.13.27",

superset-frontend/spec/javascripts/components/ColumnTypeLabel_spec.jsx

@@ -19,8 +19,7 @@
 import React from 'react';
 import { shallow } from 'enzyme';
 
-import { ColumnOption } from '@superset-ui/control-utils';
+import { ColumnOption, ColumnTypeLabel } from '@superset-ui/control-utils';
-import ColumnTypeLabel from 'src/components/ColumnTypeLabel';
 
 describe('ColumnOption', () => {
   const defaultProps = {

superset-frontend/spec/javascripts/components/MetricOption_spec.jsx

@@ -1,85 +0,0 @@
-/**
- * Licensed to the Apache Software Foundation (ASF) under one
- * or more contributor license agreements.  See the NOTICE file
- * distributed with this work for additional information
- * regarding copyright ownership.  The ASF licenses this file
- * to you under the Apache License, Version 2.0 (the
- * "License"); you may not use this file except in compliance
- * with the License.  You may obtain a copy of the License at
- *
- *   http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied.  See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-import React from 'react';
-import { shallow } from 'enzyme';
-import { InfoTooltipWithTrigger } from '@superset-ui/control-utils';
-
-import MetricOption from 'src/components/MetricOption';
-import ColumnTypeLabel from 'src/components/ColumnTypeLabel';
-
-describe('MetricOption', () => {
-  const defaultProps = {
-    metric: {
-      metric_name: 'foo',
-      verbose_name: 'Foo',
-      expression: 'SUM(foo)',
-      description: 'Foo is the greatest metric of all',
-      warning_text: 'Be careful when using foo',
-    },
-    showType: false,
-  };
-
-  let wrapper;
-  let props;
-  const factory = o => <MetricOption {...o} />;
-  beforeEach(() => {
-    wrapper = shallow(factory(defaultProps));
-    props = { ...defaultProps };
-  });
-  it('is a valid element', () => {
-    expect(React.isValidElement(<MetricOption {...defaultProps} />)).toBe(true);
-  });
-  it('shows a label with verbose_name', () => {
-    const lbl = wrapper.find('.option-label');
-    expect(lbl).toHaveLength(1);
-    expect(lbl.first().text()).toBe('Foo');
-  });
-  it('shows 3 InfoTooltipWithTrigger', () => {
-    expect(wrapper.find(InfoTooltipWithTrigger)).toHaveLength(3);
-  });
-  it('shows only 2 InfoTooltipWithTrigger when no descr', () => {
-    props.metric.description = null;
-    wrapper = shallow(factory(props));
-    expect(wrapper.find(InfoTooltipWithTrigger)).toHaveLength(2);
-  });
-  it('shows a label with metric_name when no verbose_name', () => {
-    props.metric.verbose_name = null;
-    wrapper = shallow(factory(props));
-    expect(wrapper.find('.option-label').first().text()).toBe('foo');
-  });
-  it('shows only 1 InfoTooltipWithTrigger when no descr and no warning', () => {
-    props.metric.warning_text = null;
-    wrapper = shallow(factory(props));
-    expect(wrapper.find(InfoTooltipWithTrigger)).toHaveLength(1);
-  });
-  it('sets target="_blank" when openInNewWindow is true', () => {
-    props.url = 'https://github.com/apache/incubator-superset';
-    wrapper = shallow(factory(props));
-    expect(wrapper.find('a').prop('target')).toBeNull();
-
-    props.openInNewWindow = true;
-    wrapper = shallow(factory(props));
-    expect(wrapper.find('a').prop('target')).toBe('_blank');
-  });
-  it('shows a metric type label when showType is true', () => {
-    props.showType = true;
-    wrapper = shallow(factory(props));
-    expect(wrapper.find(ColumnTypeLabel)).toHaveLength(1);
-  });
-});

superset-frontend/spec/javascripts/explore/components/MetricDefinitionOption_spec.jsx

@@ -19,10 +19,9 @@
 import React from 'react';
 import configureStore from 'redux-mock-store';
 import { shallow } from 'enzyme';
+import { ColumnOption, MetricOption } from '@superset-ui/control-utils';
 
-import { ColumnOption } from '@superset-ui/control-utils';
 import MetricDefinitionOption from 'src/explore/components/MetricDefinitionOption';
-import MetricOption from 'src/components/MetricOption';
 import AggregateOption from 'src/explore/components/AggregateOption';
 
 describe('MetricDefinitionOption', () => {

superset-frontend/spec/javascripts/explore/components/MetricDefinitionValue_spec.jsx

@@ -19,9 +19,9 @@
 /* eslint-disable no-unused-expressions */
 import React from 'react';
 import { shallow } from 'enzyme';
+import { MetricOption } from '@superset-ui/control-utils';
 
 import MetricDefinitionValue from 'src/explore/components/MetricDefinitionValue';
-import MetricOption from 'src/components/MetricOption';
 import AdhocMetricOption from 'src/explore/components/AdhocMetricOption';
 import AdhocMetric from 'src/explore/AdhocMetric';
 import { AGGREGATES } from 'src/explore/constants';

superset-frontend/src/components/ColumnTypeLabel.jsx

@@ -1,64 +0,0 @@
-/**
- * Licensed to the Apache Software Foundation (ASF) under one
- * or more contributor license agreements.  See the NOTICE file
- * distributed with this work for additional information
- * regarding copyright ownership.  The ASF licenses this file
- * to you under the Apache License, Version 2.0 (the
- * "License"); you may not use this file except in compliance
- * with the License.  You may obtain a copy of the License at
- *
- *   http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied.  See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-import React from 'react';
-import PropTypes from 'prop-types';
-
-const propTypes = {
-  type: PropTypes.string,
-};
-
-export default function ColumnTypeLabel({ type }) {
-  let stringIcon = '';
-  if (typeof type !== 'string') {
-    stringIcon = '?';
-  } else if (type === '' || type === 'expression') {
-    stringIcon = 'ƒ';
-  } else if (type === 'aggregate') {
-    stringIcon = 'AGG';
-  } else if (
-    type.match(/.*char.*/i) ||
-    type.match(/string.*/i) ||
-    type.match(/.*text.*/i)
-  ) {
-    stringIcon = 'ABC';
-  } else if (
-    type.match(/.*int.*/i) ||
-    type === 'LONG' ||
-    type === 'DOUBLE' ||
-    type === 'FLOAT'
-  ) {
-    stringIcon = '#';
-  } else if (type.match(/.*bool.*/i)) {
-    stringIcon = 'T/F';
-  } else if (type.match(/.*time.*/i)) {
-    stringIcon = 'time';
-  } else if (type.match(/unknown/i)) {
-    stringIcon = '?';
-  }
-
-  const typeIcon =
-    stringIcon === 'time' ? (
-      <i className="fa fa-clock-o type-label" />
-    ) : (
-      <div className="type-label">{stringIcon}</div>
-    );
-
-  return <span>{typeIcon}</span>;
-}
-ColumnTypeLabel.propTypes = propTypes;

superset-frontend/src/components/MetricOption.jsx

@@ -1,84 +0,0 @@
-/**
- * Licensed to the Apache Software Foundation (ASF) under one
- * or more contributor license agreements.  See the NOTICE file
- * distributed with this work for additional information
- * regarding copyright ownership.  The ASF licenses this file
- * to you under the Apache License, Version 2.0 (the
- * "License"); you may not use this file except in compliance
- * with the License.  You may obtain a copy of the License at
- *
- *   http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied.  See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-import React from 'react';
-import PropTypes from 'prop-types';
-
-import { InfoTooltipWithTrigger } from '@superset-ui/control-utils';
-import ColumnTypeLabel from './ColumnTypeLabel';
-
-const propTypes = {
-  metric: PropTypes.object.isRequired,
-  openInNewWindow: PropTypes.bool,
-  showFormula: PropTypes.bool,
-  showType: PropTypes.bool,
-  url: PropTypes.string,
-};
-const defaultProps = {
-  showFormula: true,
-  showType: false,
-};
-
-export default function MetricOption({
-  metric,
-  openInNewWindow,
-  showFormula,
-  showType,
-  url,
-}) {
-  const verbose = metric.verbose_name || metric.metric_name || metric.label;
-  const link = url ? (
-    <a href={url} target={openInNewWindow ? '_blank' : null}>
-      {verbose}
-    </a>
-  ) : (
-    verbose
-  );
-  return (
-    <div className="metric-option">
-      {showType && <ColumnTypeLabel type="expression" />}
-      <span className="option-label">{link}</span>
-      {metric.description && (
-        <InfoTooltipWithTrigger
-          className="text-muted"
-          icon="info"
-          tooltip={metric.description}
-          label={`descr-${metric.metric_name}`}
-        />
-      )}
-      {showFormula && (
-        <InfoTooltipWithTrigger
-          className="text-muted"
-          icon="question-circle-o"
-          tooltip={metric.expression}
-          label={`expr-${metric.metric_name}`}
-        />
-      )}
-      {metric.warning_text && (
-        <InfoTooltipWithTrigger
-          className="text-danger"
-          icon="warning"
-          tooltip={metric.warning_text}
-          label={`warn-${metric.metric_name}`}
-        />
-      )}
-    </div>
-  );
-}
-MetricOption.propTypes = propTypes;
-MetricOption.defaultProps = defaultProps;

superset-frontend/src/explore/components/AdhocMetricStaticOption.jsx

@@ -18,8 +18,8 @@
  */
 import React from 'react';
 import PropTypes from 'prop-types';
+import { ColumnTypeLabel } from '@superset-ui/control-utils';
 
-import ColumnTypeLabel from '../../components/ColumnTypeLabel';
 import adhocMetricType from '../propTypes/adhocMetricType';
 
 const propTypes = {

superset-frontend/src/explore/components/AggregateOption.jsx

@@ -18,8 +18,8 @@
  */
 import React from 'react';
 import PropTypes from 'prop-types';
+import { ColumnTypeLabel } from '@superset-ui/control-utils';
 
-import ColumnTypeLabel from '../../components/ColumnTypeLabel';
 import aggregateOptionType from '../propTypes/aggregateOptionType';
 
 const propTypes = {

superset-frontend/src/explore/components/FilterDefinitionOption.jsx

@@ -18,9 +18,8 @@
  */
 import React from 'react';
 import PropTypes from 'prop-types';
-import { ColumnOption } from '@superset-ui/control-utils';
+import { ColumnOption, ColumnTypeLabel } from '@superset-ui/control-utils';
 
-import ColumnTypeLabel from '../../components/ColumnTypeLabel';
 import AdhocMetricStaticOption from './AdhocMetricStaticOption';
 import columnType from '../propTypes/columnType';
 import adhocMetricType from '../propTypes/adhocMetricType';

superset-frontend/src/explore/components/MetricDefinitionOption.jsx

@@ -18,9 +18,8 @@
  */
 import React from 'react';
 import PropTypes from 'prop-types';
-import { ColumnOption } from '@superset-ui/control-utils';
+import { ColumnOption, MetricOption } from '@superset-ui/control-utils';
 
-import MetricOption from '../../components/MetricOption';
 import AggregateOption from './AggregateOption';
 import columnType from '../propTypes/columnType';
 import savedMetricType from '../propTypes/savedMetricType';

superset-frontend/src/explore/components/MetricDefinitionValue.jsx

@@ -18,11 +18,11 @@
  */
 import React from 'react';
 import PropTypes from 'prop-types';
+import { MetricOption } from '@superset-ui/control-utils';
 
 import AdhocMetricOption from './AdhocMetricOption';
 import AdhocMetric from '../AdhocMetric';
 import columnType from '../propTypes/columnType';
-import MetricOption from '../../components/MetricOption';
 import savedMetricType from '../propTypes/savedMetricType';
 import adhocMetricType from '../propTypes/adhocMetricType';
 

superset-frontend/src/explore/components/controls/DatasourceControl.jsx

@@ -30,9 +30,8 @@ import {
   Well,
 } from 'react-bootstrap';
 import { t } from '@superset-ui/translation';
-import { ColumnOption } from '@superset-ui/control-utils';
+import { ColumnOption, MetricOption } from '@superset-ui/control-utils';
 import ControlHeader from '../ControlHeader';
-import MetricOption from '../../../components/MetricOption';
 import DatasourceModal from '../../../datasource/DatasourceModal';
 import ChangeDatasourceModal from '../../../datasource/ChangeDatasourceModal';
 import TooltipWrapper from '../../../components/TooltipWrapper';

superset-frontend/src/visualizations/TimeTable/TimeTable.jsx

@@ -24,9 +24,11 @@ import { Table, Thead, Th, Tr, Td } from 'reactable-arc';
 import { formatNumber } from '@superset-ui/number-format';
 import { formatTime } from '@superset-ui/time-format';
 import moment from 'moment';
-import { InfoTooltipWithTrigger } from '@superset-ui/control-utils';
+import {
+  InfoTooltipWithTrigger,
+  MetricOption,
+} from '@superset-ui/control-utils';
 
-import MetricOption from '../../components/MetricOption';
 import FormattedNumber from './FormattedNumber';
 import SparklineCell from './SparklineCell';
 import './TimeTable.less';