fix: Enable ESLint rule default-props-match-prop-types (#11058)

* Re-enable ESLint rule default-props-match-props-types

* Add cypress test for switching tabs

* fix

* Typo fix

* Test fix

superset-frontend/.eslintrc.js

@@ -122,7 +122,6 @@ module.exports = {
         'padded-blocks': 0,
         'prefer-arrow-callback': 0,
         'prefer-destructuring': ['error', { object: true, array: false }],
-        'react/default-props-match-prop-types': 0, // disabled temporarily
         'react/destructuring-assignment': 0, // re-enable up for discussion
         'react/forbid-prop-types': 0,
         'react/jsx-filename-extension': [1, { extensions: ['.jsx', '.tsx'] }],
@@ -233,7 +232,6 @@ module.exports = {
     'prefer-arrow-callback': 0,
     'prefer-object-spread': 1,
     'prefer-destructuring': ['error', { object: true, array: false }],
-    'react/default-props-match-prop-types': 0, // disabled temporarily
     'react/destructuring-assignment': 0, // re-enable up for discussion
     'react/forbid-prop-types': 0,
     'react/jsx-filename-extension': [1, { extensions: ['.jsx', '.tsx'] }],

superset-frontend/cypress-base/cypress/integration/dashboard/tabs.test.js

@@ -91,6 +91,22 @@ describe('Dashboard tabs', () => {
     });
   });
 
+  it('should switch active tab on click', () => {
+    cy.wait('@filterRequest');
+    cy.wait('@treemapRequest');
+
+    cy.get('.dashboard-component-tabs')
+      .first()
+      .find('ul.nav.nav-tabs li')
+      .as('tabs');
+
+    cy.get('@tabs').first().click().should('have.class', 'active');
+    cy.get('@tabs').last().should('not.have.class', 'active');
+
+    cy.get('@tabs').last().click().should('have.class', 'active');
+    cy.get('@tabs').first().should('not.have.class', 'active');
+  });
+
   it('should load charts when tab is visible', () => {
     // landing in first tab, should see 2 charts
     cy.wait('@filterRequest');

superset-frontend/src/CRUD/Field.jsx

@@ -39,10 +39,9 @@ const propTypes = {
   compact: PropTypes.bool,
 };
 const defaultProps = {
-  controlProps: {},
   onChange: () => {},
   compact: false,
-  desc: null,
+  description: null,
 };
 
 export default class Field extends React.PureComponent {

superset-frontend/src/SqlLab/components/ExploreCtasResultsButton.jsx

@@ -25,7 +25,7 @@ import { t } from '@superset-ui/core';
 import { InfoTooltipWithTrigger } from '@superset-ui/chart-controls';
 
 import Button from 'src/components/Button';
-import { exploreChart } from '../../explore/exploreUtils';
+import { exploreChart } from 'src/explore/exploreUtils';
 import * as actions from '../actions/sqlLab';
 
 const propTypes = {
@@ -37,10 +37,6 @@ const propTypes = {
   templateParams: PropTypes.string,
 };
 
-const defaultProps = {
-  vizRequest: {},
-};
-
 class ExploreCtasResultsButton extends React.PureComponent {
   constructor(props) {
     super(props);
@@ -113,7 +109,6 @@ class ExploreCtasResultsButton extends React.PureComponent {
   }
 }
 ExploreCtasResultsButton.propTypes = propTypes;
-ExploreCtasResultsButton.defaultProps = defaultProps;
 
 function mapStateToProps({ sqlLab, common }) {
   return {

superset-frontend/src/SqlLab/components/SqlEditorLeftBar.jsx

@@ -25,7 +25,7 @@ import TableSelector from '../../components/TableSelector';
 
 const propTypes = {
   queryEditor: PropTypes.object.isRequired,
-  height: PropTypes.number.isRequired,
+  height: PropTypes.number,
   tables: PropTypes.array,
   actions: PropTypes.object,
   database: PropTypes.object,

superset-frontend/src/SqlLab/components/TemplateParamsEditor.jsx

@@ -33,8 +33,6 @@ const propTypes = {
 };
 
 const defaultProps = {
-  label: null,
-  description: null,
   onChange: () => {},
   code: '{}',
 };

superset-frontend/src/components/Hotkeys.jsx

@@ -28,7 +28,7 @@ const propTypes = {
       descr: PropTypes.string.isRequired,
       func: PropTypes.func,
     }),
-  ).isRequired,
+  ),
   header: PropTypes.string,
   placement: PropTypes.string,
 };

superset-frontend/src/components/Select/OnPasteSelect.jsx

@@ -81,12 +81,12 @@ export default class OnPasteSelect extends React.Component {
 }
 
 OnPasteSelect.propTypes = {
-  separator: PropTypes.array.isRequired,
+  separator: PropTypes.array,
   selectWrap: PropTypes.elementType,
   selectRef: PropTypes.func,
   onChange: PropTypes.func.isRequired,
-  valueKey: PropTypes.string.isRequired,
-  labelKey: PropTypes.string.isRequired,
+  valueKey: PropTypes.string,
+  labelKey: PropTypes.string,
   options: PropTypes.array,
   isMulti: PropTypes.bool,
   value: PropTypes.any,

superset-frontend/src/dashboard/components/ColorSchemeControlWrapper.jsx

@@ -24,7 +24,7 @@ import { getCategoricalSchemeRegistry, t } from '@superset-ui/core';
 import ColorSchemeControl from 'src/explore/components/controls/ColorSchemeControl';
 
 const propTypes = {
-  onChange: PropTypes.func.isRequired,
+  onChange: PropTypes.func,
   colorScheme: PropTypes.string,
 };
 

superset-frontend/src/dashboard/components/DashboardBuilder.jsx

@@ -54,7 +54,7 @@ const propTypes = {
   dashboardLayout: PropTypes.object.isRequired,
   deleteTopLevelTabs: PropTypes.func.isRequired,
   editMode: PropTypes.bool.isRequired,
-  showBuilderPane: PropTypes.func.isRequired,
+  showBuilderPane: PropTypes.func,
   colorScheme: PropTypes.string,
   setColorSchemeAndUnsavedChanges: PropTypes.func.isRequired,
   handleComponentDrop: PropTypes.func.isRequired,

superset-frontend/src/dashboard/components/PropertiesModal.jsx

@@ -35,7 +35,7 @@ import '../stylesheets/buttons.less';
 
 const propTypes = {
   dashboardId: PropTypes.number.isRequired,
-  show: PropTypes.bool.isRequired,
+  show: PropTypes.bool,
   onHide: PropTypes.func,
   colorScheme: PropTypes.object,
   setColorSchemeAndUnsavedChanges: PropTypes.func,

superset-frontend/src/dashboard/components/SliceAdder.jsx

@@ -39,7 +39,7 @@ const propTypes = {
   lastUpdated: PropTypes.number.isRequired,
   errorMessage: PropTypes.string,
   userId: PropTypes.string.isRequired,
-  selectedSliceIds: PropTypes.arrayOf(PropTypes.number).isRequired,
+  selectedSliceIds: PropTypes.arrayOf(PropTypes.number),
   editMode: PropTypes.bool,
   height: PropTypes.number,
 };

superset-frontend/src/dashboard/components/SliceHeader.jsx

@@ -53,7 +53,6 @@ const propTypes = {
 const defaultProps = {
   innerRef: null,
   forceRefresh: () => ({}),
-  removeSlice: () => ({}),
   updateSliceName: () => ({}),
   toggleExpandSlice: () => ({}),
   exploreChart: () => ({}),

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

@@ -56,10 +56,6 @@ const propTypes = {
   updateComponents: PropTypes.func.isRequired,
 };
 
-const defaultProps = {
-  rowHeight: null,
-};
-
 class Row extends React.PureComponent {
   constructor(props) {
     super(props);
@@ -192,6 +188,5 @@ class Row extends React.PureComponent {
 }
 
 Row.propTypes = propTypes;
-Row.defaultProps = defaultProps;
 
 export default Row;

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

@@ -69,7 +69,6 @@ const propTypes = {
 };
 
 const defaultProps = {
-  children: null,
   renderTabContent: true,
   renderHoverMenu: true,
   availableColumnCount: 0,

superset-frontend/src/dashboard/components/menu/WithPopoverMenu.jsx

@@ -35,7 +35,6 @@ const defaultProps = {
   children: null,
   disableClick: false,
   onChangeFocus: null,
-  onPressDelete() {},
   menuItems: [],
   isFocused: false,
   shouldFocus: (event, container) =>

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

@@ -21,6 +21,8 @@ import PropTypes from 'prop-types';
 import { bindActionCreators } from 'redux';
 import { connect } from 'react-redux';
 
+import { logEvent } from 'src/logger/actions';
+import { addDangerToast } from 'src/messageToasts/actions';
 import ComponentLookup from '../components/gridComponents';
 import getDetailedComponentWidth from '../util/getDetailedComponentWidth';
 import { getActiveFilters } from '../util/activeDashboardFilters';
@@ -34,8 +36,6 @@ import {
   handleComponentDrop,
 } from '../actions/dashboardLayout';
 import { setDirectPathToChild, setMountedTab } from '../actions/dashboardState';
-import { logEvent } from '../../logger/actions';
-import { addDangerToast } from '../../messageToasts/actions';
 
 const propTypes = {
   component: componentShape.isRequired,
@@ -48,6 +48,7 @@ const propTypes = {
   directPathToChild: PropTypes.arrayOf(PropTypes.string),
   directPathLastUpdated: PropTypes.number,
   dashboardId: PropTypes.number.isRequired,
+  isComponentVisible: PropTypes.bool,
 };
 
 const defaultProps = {

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

@@ -37,7 +37,6 @@ const propTypes = {
 const defaultProps = {
   onStop: () => {},
   onSave: () => {},
-  disabled: false,
 };
 
 // Prolly need to move this to a global context

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

@@ -35,8 +35,8 @@ const propTypes = {
   choices: PropTypes.oneOfType([
     PropTypes.arrayOf(PropTypes.array),
     PropTypes.func,
-  ]).isRequired,
-  schemes: PropTypes.oneOfType([PropTypes.object, PropTypes.func]).isRequired,
+  ]),
+  schemes: PropTypes.oneOfType([PropTypes.object, PropTypes.func]),
   isLinear: PropTypes.bool,
 };
 

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

@@ -37,7 +37,7 @@ export const DEFAULT_VIEWPORT = {
 const PARAMS = ['longitude', 'latitude', 'zoom', 'bearing', 'pitch'];
 
 const propTypes = {
-  onChange: PropTypes.func.isRequired,
+  onChange: PropTypes.func,
   value: PropTypes.shape({
     longitude: PropTypes.number,
     latitude: PropTypes.number,