Fix lint

superset-frontend/src/dashboard/components/gridComponents/Chart.jsx

@@ -20,8 +20,10 @@ import cx from 'classnames';
 import { useCallback, useEffect, useRef, useMemo, useState, memo } from 'react';
 import PropTypes from 'prop-types';
 import { styled, t, logging } from '@superset-ui/core';
-import { debounce, isEqual } from 'lodash';
-import { useHistory, withRouter } from 'react-router-dom';
+import { debounce } from 'lodash';
+import { useHistory } from 'react-router-dom';
+import { bindActionCreators } from 'redux';
+import { useDispatch, useSelector } from 'react-redux';
 
 import { exportChart, mountExploreUrl } from 'src/explore/exploreUtils';
 import ChartContainer from 'src/components/Chart/ChartContainer';
@@ -32,16 +34,11 @@ import {
   LOG_ACTIONS_EXPORT_XLSX_DASHBOARD_CHART,
   LOG_ACTIONS_FORCE_REFRESH_CHART,
 } from 'src/logger/LogUtils';
-import { areObjectsEqual } from 'src/reduxUtils';
 import { postFormData } from 'src/explore/exploreUtils/formData';
 import { URL_PARAMS } from 'src/constants';
 
 import SliceHeader from '../SliceHeader';
 import MissingChart from '../MissingChart';
-import { slicePropShape, chartPropShape } from '../../util/propShapes';
-import { useDispatch, useSelector } from 'react-redux';
-import { bindActionCreators } from 'redux';
-import { updateComponents } from '../../actions/dashboardLayout';
 import {
   addDangerToast,
   addSuccessToast,
@@ -76,10 +73,6 @@ const propTypes = {
 // we use state + shouldComponentUpdate() logic to prevent perf-wrecking
 // resizing across all slices on a dashboard on every update
 const RESIZE_TIMEOUT = 500;
-const SHOULD_UPDATE_ON_PROP_CHANGES = Object.keys(propTypes).filter(
-  prop =>
-    prop !== 'width' && prop !== 'height' && prop !== 'isComponentVisible',
-);
 const DEFAULT_HEADER_HEIGHT = 22;
 
 const ChartWrapper = styled.div`
@@ -106,7 +99,7 @@ const SliceContainer = styled.div`
 
 const EMPTY_OBJECT = {};
 
-export const Chart = props => {
+const Chart = props => {
   const dispatch = useDispatch();
   const descriptionRef = useRef(null);
   const headerRef = useRef(null);
@@ -194,11 +187,12 @@ export const Chart = props => {
     }
   }, [isExpanded]);
 
-  useEffect(() => {
-    return () => {
+  useEffect(
+    () => () => {
       resize.cancel();
-    };
-  }, []);
+    },
+    [],
+  );
 
   useEffect(() => {
     resize();
@@ -494,7 +488,7 @@ export const Chart = props => {
         <ChartContainer
           width={width}
           height={getChartHeight()}
-          addFilter={boundActionCreators.changeFilter}
+          addFilter={addFilter}
           onFilterMenuOpen={handleFilterMenuOpen}
           onFilterMenuClose={handleFilterMenuClose}
           annotationData={chart.annotationData}

superset-frontend/src/dashboard/components/gridComponents/Tab.jsx

@@ -16,11 +16,10 @@
  * specific language governing permissions and limitations
  * under the License.
  */
-import { PureComponent, Fragment, useCallback, memo } from 'react';
+import { Fragment, useCallback, memo } from 'react';
 import PropTypes from 'prop-types';
 import classNames from 'classnames';
-import { bindActionCreators } from 'redux';
-import { connect, useDispatch, useSelector } from 'react-redux';
+import { useDispatch, useSelector } from 'react-redux';
 import { styled, t } from '@superset-ui/core';
 
 import { EmptyStateMedium } from 'src/components/EmptyState';
@@ -51,7 +50,6 @@ const propTypes = {
   onDragTab: PropTypes.func,
   onHoverTab: PropTypes.func,
   editMode: PropTypes.bool.isRequired,
-  canEdit: PropTypes.bool.isRequired,
 
   // grid related
   availableColumnCount: PropTypes.number,
@@ -64,7 +62,6 @@ const propTypes = {
   handleComponentDrop: PropTypes.func.isRequired,
   updateComponents: PropTypes.func.isRequired,
   setDirectPathToChild: PropTypes.func.isRequired,
-  setEditMode: PropTypes.func.isRequired,
 };
 
 const defaultProps = {
@@ -101,7 +98,7 @@ const TitleDropIndicator = styled.div`
 const renderDraggableContent = dropProps =>
   dropProps.dropIndicatorProps && <div {...dropProps.dropIndicatorProps} />;
 
-export const Tab = props => {
+const Tab = props => {
   const dispatch = useDispatch();
   const canEdit = useSelector(state => state.dashboardInfo.dash_edit_perm);
   const handleChangeTab = useCallback(
@@ -157,9 +154,7 @@ export const Tab = props => {
     [props.handleComponentDrop],
   );
 
-  const shouldDropToChild = useCallback(item => {
-    return item.type !== TAB_TYPE;
-  }, []);
+  const shouldDropToChild = useCallback(item => item.type !== TAB_TYPE, []);
 
   const renderTabContent = useCallback(() => {
     const {

superset-frontend/src/dashboard/components/gridComponents/Tabs.jsx

@@ -16,16 +16,10 @@
  * specific language governing permissions and limitations
  * under the License.
  */
-import {
-  PureComponent,
-  useCallback,
-  useEffect,
-  useMemo,
-  useState,
-} from 'react';
+import { useCallback, useEffect, useMemo, useState } from 'react';
 import PropTypes from 'prop-types';
 import { styled, t, usePrevious } from '@superset-ui/core';
-import { connect, useSelector } from 'react-redux';
+import { useSelector } from 'react-redux';
 import { LineEditableTabs } from 'src/components/Tabs';
 import Icons from 'src/components/Icons';
 import { LOG_ACTIONS_SELECT_DASHBOARD_TAB } from 'src/logger/LogUtils';
@@ -145,12 +139,12 @@ export const Tabs = props => {
       0,
       findTabIndexByComponentId({
         currentComponent: props.component,
-        directPathToChild: props.directPathToChild,
+        directPathToChild,
       }),
     );
     if (tabIndex === 0 && activeTabs?.length) {
       props.component.children.forEach((tabId, index) => {
-        if (tabIndex === 0 && props.activeTabs?.includes(tabId)) {
+        if (tabIndex === 0 && activeTabs?.includes(tabId)) {
           tabIndex = index;
         }
       });
@@ -162,7 +156,7 @@ export const Tabs = props => {
       tabIndex,
       activeKey,
     };
-  }, [activeTabs?.length, props.component, props.directPathToChild]);
+  }, [activeTabs?.length, props.component, directPathToChild]);
 
   const [activeKey, setActiveKey] = useState(initActiveKey);
   const [selectedTabIndex, setSelectedTabIndex] = useState(initTabIndex);
@@ -171,7 +165,7 @@ export const Tabs = props => {
   const [draggingTabId, setDraggingTabId] = useState(null);
   const prevActiveKey = usePrevious(activeKey);
   const prevDashboardId = usePrevious(props.dashboardId);
-  const prevDirectPathToChild = usePrevious(props.directPathToChild);
+  const prevDirectPathToChild = usePrevious(directPathToChild);
   const prevTabIds = usePrevious(props.component.children);
 
   useEffect(() => {
@@ -201,7 +195,7 @@ export const Tabs = props => {
 
     if (props.isComponentVisible) {
       const nextFocusComponent = getLeafComponentIdFromPath(
-        props.directPathToChild,
+        directPathToChild,
       );
       const currentFocusComponent = getLeafComponentIdFromPath(
         prevDirectPathToChild,
@@ -217,7 +211,7 @@ export const Tabs = props => {
       ) {
         const nextTabIndex = findTabIndexByComponentId({
           currentComponent: props.component,
-          directPathToChild: props.directPathToChild,
+          directPathToChild,
         });
 
         // make sure nextFocusComponent is under this tabs component
@@ -229,7 +223,7 @@ export const Tabs = props => {
     }
   }, [
     props.component,
-    props.directPathToChild,
+    directPathToChild,
     props.isComponentVisible,
     selectedTabIndex,
     prevDirectPathToChild,

superset-frontend/src/dashboard/containers/DashboardComponent.jsx

@@ -19,7 +19,7 @@
 import { useCallback, memo, useMemo } from 'react';
 import PropTypes from 'prop-types';
 import { bindActionCreators } from 'redux';
-import { connect, useSelector, useDispatch } from 'react-redux';
+import { useSelector, useDispatch } from 'react-redux';
 import { logEvent } from 'src/logger/actions';
 import { addDangerToast } from 'src/components/MessageToasts/actions';
 import { componentLookup } from 'src/dashboard/components/gridComponents';
@@ -60,12 +60,7 @@ const propTypes = {
   isComponentVisible: PropTypes.bool,
 };
 
-const DashboardComponent = ({
-  id,
-  parentId,
-  isComponentVisible = true,
-  ...rest
-}) => {
+const DashboardComponent = ({ id, parentId, ...rest }) => {
   const dispatch = useDispatch();
   const dashboardLayout = useSelector(state => state.dashboardLayout.present);
   const dashboardInfo = useSelector(state => state.dashboardInfo);
@@ -112,8 +107,9 @@ const DashboardComponent = ({
           components: dashboardLayout,
         });
 
-        if (componentType === ROW_TYPE)
+        if (componentType === ROW_TYPE) {
           return { occupiedColumnCount: occupiedWidth };
+        }
         if (componentType === COLUMN_TYPE) {
           return { minColumnWidth: minimumWidth };
         }

superset-frontend/src/dashboard/util/charts/useChartIds.ts

@@ -19,8 +19,5 @@
 import { useSelector } from 'react-redux';
 import { RootState } from 'src/dashboard/types';
 
-export const useChartIds = () => {
-  return useSelector<RootState, number[]>(
-    state => state.dashboardState.sliceIds,
-  );
-};
+export const useChartIds = () =>
+  useSelector<RootState, number[]>(state => state.dashboardState.sliceIds);

superset-frontend/src/dashboard/util/useFilterFocusHighlightStyles.ts

@@ -16,12 +16,12 @@
  * specific language governing permissions and limitations
  * under the License.
  */
+import { useMemo } from 'react';
 import { Filter, useTheme } from '@superset-ui/core';
 import { useSelector } from 'react-redux';
 
 import { RootState } from 'src/dashboard/types';
 import { getRelatedCharts } from './getRelatedCharts';
-import { useMemo } from 'react';
 
 const unfocusedChartStyles = { opacity: 0.3, pointerEvents: 'none' };
 const EMPTY = {};