chore: enable no-unused-vars and prefer-template eslint rules (#10350)

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

@@ -19,7 +19,7 @@
 import React from 'react';
 import PropTypes from 'prop-types';
 import { FormGroup } from 'react-bootstrap';
-import { Select, Creatable } from 'src/components/Select';
+import { Select } from 'src/components/Select';
 import { t } from '@superset-ui/translation';
 import { SupersetClient } from '@superset-ui/connection';
 
@@ -236,7 +236,7 @@ export default class AdhocFilterEditPopoverSimpleTabContent extends React.Compon
             loading: false,
           }));
         })
-        .catch(error => {
+        .catch(() => {
           this.setState(() => ({
             suggestions: [],
             abortActiveRequest: null,

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

@@ -144,7 +144,7 @@ export default class AdhocFilterEditPopoverSqlTabContent extends React.Component
             ref={this.handleAceEditorRef}
             mode="sql"
             theme="github"
-            height={height - 100 + 'px'}
+            height={`${height - 100}px`}
             onChange={this.onSqlExpressionChange}
             width="100%"
             showGutter={false}

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

@@ -35,7 +35,7 @@ import 'brace/ext/language_tools';
 import { t } from '@superset-ui/translation';
 import { ColumnOption } from '@superset-ui/chart-controls';
 
-import { AGGREGATES, AGGREGATES_OPTIONS } from '../constants';
+import { AGGREGATES_OPTIONS } from '../constants';
 import AdhocMetricEditPopoverTitle from './AdhocMetricEditPopoverTitle';
 import columnType from '../propTypes/columnType';
 import AdhocMetric, { EXPRESSION_TYPES } from '../AdhocMetric';
@@ -283,7 +283,7 @@ export default class AdhocMetricEditPopover extends React.Component {
                   ref={this.handleAceEditorRef}
                   mode="sql"
                   theme="github"
-                  height={this.state.height - 43 + 'px'}
+                  height={`${this.state.height - 43}px`}
                   onChange={this.onSqlExpressionChange}
                   width="100%"
                   showGutter={false}

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

@@ -19,7 +19,6 @@
 import React from 'react';
 import PropTypes from 'prop-types';
 import { Label, OverlayTrigger } from 'react-bootstrap';
-import { thresholdScott } from 'd3-array';
 
 import AdhocMetricEditPopover from './AdhocMetricEditPopover';
 import AdhocMetric from '../AdhocMetric';

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

@@ -22,10 +22,7 @@ import PropTypes from 'prop-types';
 import { bindActionCreators } from 'redux';
 import { connect } from 'react-redux';
 import { Alert, Tab, Tabs } from 'react-bootstrap';
-import { isPlainObject } from 'lodash';
 import { t } from '@superset-ui/translation';
-import { getChartControlPanelRegistry } from '@superset-ui/chart';
-import { sharedControls } from '@superset-ui/chart-controls';
 
 import ControlPanelSection from './ControlPanelSection';
 import ControlRow from './ControlRow';
@@ -64,7 +61,7 @@ class ControlPanelsContainer extends React.Component {
   }
 
   renderControl({ name, config }) {
-    const { actions, controls, exploreState, form_data: formData } = this.props;
+    const { actions, controls, form_data: formData } = this.props;
     const { visibility } = config;
 
     // If the control item is not an object, we have to look up the control data from

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

@@ -47,10 +47,10 @@ export default class EmbedCodeButton extends React.Component {
   }
 
   generateEmbedHTML() {
-    const srcLink =
+    const srcLink = `${
       window.location.origin +
-      getExploreLongUrl(this.props.latestQueryFormData, 'standalone') +
-      `&height=${this.state.height}`;
+      getExploreLongUrl(this.props.latestQueryFormData, 'standalone')
+    }&height=${this.state.height}`;
     return (
       '<iframe\n' +
       `  width="${this.state.width}"\n` +

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

@@ -180,7 +180,7 @@ class ExploreViewContainer extends React.Component {
 
   getHeight() {
     if (this.props.forcedHeight) {
-      return this.props.forcedHeight + 'px';
+      return `${this.props.forcedHeight}px`;
     }
     const navHeight = this.props.standalone ? 0 : 90;
     return `${window.innerHeight - navHeight}px`;

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

@@ -245,12 +245,12 @@ export default class AdhocFilterControl extends React.Component {
         } else if (option.column_name) {
           results.push({
             ...option,
-            filterOptionName: '_col_' + option.column_name,
+            filterOptionName: `_col_${option.column_name}`,
           });
         } else if (option instanceof AdhocMetric) {
           results.push({
             ...option,
-            filterOptionName: '_adhocmetric_' + option.label,
+            filterOptionName: `_adhocmetric_${option.label}`,
           });
         }
         return results;

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

@@ -23,7 +23,6 @@ import {
   DropdownButton,
   FormControl,
   FormGroup,
-  Glyphicon,
   InputGroup,
   Label,
   MenuItem,
@@ -124,7 +123,7 @@ function getStateFromSeparator(value) {
 }
 
 function getStateFromCommonTimeFrame(value) {
-  const units = value.split(' ')[1] + 's';
+  const units = `${value.split(' ')[1]}s`;
   return {
     tab: TABS.DEFAULTS,
     type: TYPES.DEFAULTS,

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

@@ -279,11 +279,11 @@ export default class MetricsControl extends React.PureComponent {
       if (option.metric_name) {
         results.push({ ...option, optionName: option.metric_name });
       } else if (option.column_name) {
-        results.push({ ...option, optionName: '_col_' + option.column_name });
+        results.push({ ...option, optionName: `_col_${option.column_name}` });
       } else if (option.aggregate_name) {
         results.push({
           ...option,
-          optionName: '_aggregate_' + option.aggregate_name,
+          optionName: `_aggregate_${option.aggregate_name}`,
         });
       }
       return results;

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

@@ -76,7 +76,7 @@ const SelectAsyncControl = props => {
         dataEndpoint={dataEndpoint}
         onChange={onSelectionChange}
         onAsyncError={errorMsg =>
-          this.props.addDangerToast(onAsyncErrorMessage + ': ' + errorMsg)
+          this.props.addDangerToast(`${onAsyncErrorMessage}: ${errorMsg}`)
         }
         mutator={mutator}
         multi={multi}

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

@@ -139,7 +139,6 @@ export default class SelectControl extends React.PureComponent {
     } else if (props.choices) {
       // Accepts different formats of input
       options = props.choices.map(c => {
-        let option;
         if (Array.isArray(c)) {
           const [value, label] = c.length > 1 ? c : [c[0], c[0]];
           return { label, [props.valueKey]: value };

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

@@ -85,11 +85,9 @@ export default class ViewportControl extends React.Component {
   }
   renderLabel() {
     if (this.props.value.longitude && this.props.value.latitude) {
-      return (
-        decimal2sexagesimal(this.props.value.longitude) +
-        ' | ' +
-        decimal2sexagesimal(this.props.value.latitude)
-      );
+      return `${decimal2sexagesimal(
+        this.props.value.longitude,
+      )} | ${decimal2sexagesimal(this.props.value.latitude)}`;
     }
     return 'N/A';
   }