refactor: state constructor simplifications (react-bootstrap#3993)

Author: mxschmitt

src/AbstractNav.js

@@ -27,11 +27,9 @@ class AbstractNav extends React.Component {
     activeKey: PropTypes.any,
   };
 
-  constructor(...args) {
-    super(...args);
-
-    this.state = { navContext: null };
-  }
+  state = {
+    navContext: null,
+  };
 
   static getDerivedStateFromProps({
     activeKey,

src/Carousel.js

@@ -120,17 +120,14 @@ const defaultProps = {
 };
 
 class Carousel extends React.Component {
-  constructor(props, context) {
-    super(props, context);
+  state = {
+    prevClasses: '',
+    currentClasses: 'active',
+  };
 
-    this.state = {
-      prevClasses: '',
-      currentClasses: 'active',
-    };
-    this.isUnmounted = false;
+  isUnmounted = false;
 
-    this.carousel = React.createRef();
-  }
+  carousel = React.createRef();
 
   componentDidMount() {
     this.cycle();

src/Modal.js

@@ -183,14 +183,11 @@ function BackdropTransition(props) {
 /* eslint-enable no-use-before-define */
 
 class Modal extends React.Component {
-  constructor(props, context) {
-    super(props, context);
+  state = { style: {} };
 
-    this.state = { style: {} };
-    this.modalContext = {
-      onHide: () => this.props.onHide(),
-    };
-  }
+  modalContext = {
+    onHide: () => this.props.onHide(),
+  };
 
   componentWillUnmount() {
     // Clean up the listener if we need to.

src/Navbar.js

@@ -123,15 +123,11 @@ const defaultProps = {
 };
 
 class Navbar extends React.Component {
-  constructor(...args) {
-    super(...args);
-
-    this.state = {
-      navbarContext: {
-        onToggle: this.handleToggle,
-      },
-    };
-  }
+  state = {
+    navbarContext: {
+      onToggle: () => this.handleToggle(),
+    },
+  };
 
   static getDerivedStateFromProps({ bsPrefix, expanded }, prevState) {
     return {

src/TabContainer.js

@@ -81,8 +81,8 @@ class TabContainer extends React.Component {
     activeKey: PropTypes.any,
   };
 
-  constructor(...args) {
-    super(...args);
+  constructor(props) {
+    super(props);
 
     this.state = {
       tabContext: {

src/ThemeProvider.js

@@ -10,8 +10,8 @@ class ThemeProvider extends React.Component {
     prefixes: PropTypes.object.isRequired,
   };
 
-  constructor(...args) {
-    super(...args);
+  constructor(props) {
+    super(props);
     this.prefixes = new Map();
     Object.keys(this.props.prefixes).forEach(key => {
       this.prefixes.set(key, this.props.prefixes[key]);

src/Toast.js

@@ -79,7 +79,9 @@ const Toast = ({
       };
     }
     return () => null;
-  }, [autohide, show]);
+    // also clear the Timeout of the delay has changed
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [autohide, onClose, show]);
   const useAnimation = Transition && animation;
   const toast = (
     <div

test/ModalSpec.js

@@ -182,13 +182,9 @@ describe('<Modal>', () => {
 
     it('should remove resize listener when unmounted', () => {
       class Component extends React.Component {
-        constructor(props, context) {
-          super(props, context);
-
-          this.state = {
-            show: true,
-          };
-        }
+        state = {
+          show: true,
+        };
 
         render() {
           if (!this.state.show) {

test/OverlayTriggerSpec.js

@@ -283,16 +283,13 @@ describe('<OverlayTrigger>', () => {
     describe('replaced overlay', () => {
       it('Should still be shown', () => {
         class ReplacedOverlay extends React.Component {
-          constructor(props) {
-            super(props);
+          state = {
+            replaced: false,
+          };
 
-            this.handleClick = this.handleClick.bind(this);
-            this.state = { replaced: false };
-          }
-
-          handleClick() {
+          handleClick = () => {
             this.setState({ replaced: true });
-          }
+          };
 
           render() {
             if (this.state.replaced) {

www/src/components/Sonnet.js

@@ -1,8 +1,8 @@
 import React from 'react';
 
 class Sonnet extends React.Component {
-  constructor(...args) {
-    super(...args);
+  constructor(props) {
+    super(props);
     import('shakespeare-data').then(s =>
       this.setState({ sonnet: s.sonnets.random() }),
     );