fix(components): Fix state warning errors (#1255)

* fix(components): Fix state warning errors

* fix(components): Fix state warning errors

* fix: clean up gDSFP

* chore:update other dDSPS's

* chore: added prop value and min camparison back into cunstructor

Author: okstaticzero

.storybook/.babelrc

@@ -5,10 +5,7 @@
       {
         "modules": false,
         "targets": {
-          "browsers": [
-            "last 1 version",
-            "ie >= 11"
-          ]
+          "browsers": ["last 1 version", "ie >= 11"]
         }
       }
     ],
@@ -20,8 +17,5 @@
       }
     ]
   ],
-  "plugins": [
-    "dev-expression",
-    "react-docgen"
-  ]
+  "plugins": ["dev-expression", "react-docgen"]
 }

src/components/AccordionItem/AccordionItem.js

@@ -5,6 +5,8 @@ import { iconChevronRight } from 'carbon-icons';
 import Icon from '../Icon';
 
 export default class AccordionItem extends Component {
+  state = {};
+
   static propTypes = {
     /**
      * Provide the contents of your AccordionItem

src/components/ComposedModal/ComposedModal.js

@@ -6,6 +6,8 @@ import Icon from '../Icon';
 import classNames from 'classnames';
 
 export default class ComposedModal extends Component {
+  state = {};
+
   static defaultProps = {
     onKeyDown: () => {},
   };
@@ -43,8 +45,8 @@ export default class ComposedModal extends Component {
   }
 
   static getDerivedStateFromProps({ open }, state) {
-    const { prevOpen } = state || {};
-    return state && prevOpen === open
+    const { prevOpen } = state;
+    return prevOpen === open
       ? null
       : {
           open,

src/components/ContentSwitcher/ContentSwitcher.js

@@ -4,6 +4,8 @@ import classNames from 'classnames';
 import { composeEventHandlers } from '../../tools/events';
 
 export default class ContentSwitcher extends React.Component {
+  state = {};
+
   static propTypes = {
     /**
      * Pass in Switch components to be rendered in the ContentSwitcher
@@ -32,8 +34,8 @@ export default class ContentSwitcher extends React.Component {
   };
 
   static getDerivedStateFromProps({ selectedIndex }, state) {
-    const { prevSelectedIndex } = state || {};
-    return state && prevSelectedIndex === selectedIndex
+    const { prevSelectedIndex } = state;
+    return prevSelectedIndex === selectedIndex
       ? null
       : {
           selectedIndex,

src/components/FileUploader/FileUploader.js

@@ -8,6 +8,8 @@ import { ButtonTypes } from '../../prop-types/types';
 import { iconCloseSolid, iconCheckmarkSolid } from 'carbon-icons';
 
 export class FileUploaderButton extends Component {
+  state = {};
+
   static propTypes = {
     /**
      * Provide a custom className to be applied to the container node

src/components/NumberInput/NumberInput-test.js

@@ -136,9 +136,10 @@ describe('NumberInput', () => {
         });
 
         it('should set invalidText when value is empty string', () => {
-          wrapper.setProps({ value: '' });
+          wrapper.setState({ value: '' });
           const invalidText = wrapper.find('.bx--form-requirement');
           expect(invalidText.length).toEqual(1);
+
           expect(invalidText.text()).toEqual('invalid text');
         });
 

src/components/NumberInput/NumberInput.js

@@ -5,6 +5,15 @@ import Icon from '../Icon';
 import classNames from 'classnames';
 
 export default class NumberInput extends Component {
+  constructor(props) {
+    super(props);
+    let value = props.value;
+    if (props.min || props.min === 0) {
+      value = Math.max(props.min, value);
+    }
+    this.state = { value };
+  }
+
   static propTypes = {
     className: PropTypes.string,
     disabled: PropTypes.bool,
@@ -52,10 +61,10 @@ export default class NumberInput extends Component {
 
   static getDerivedStateFromProps({ min, value }, state) {
     const { prevValue } = state || {};
-    return state && prevValue === value
+    return prevValue === value
       ? null
       : {
-          value: state || isNaN(min) ? value : Math.max(min, value),
+          value: isNaN(min) ? value : Math.max(min, value),
           prevValue: value,
         };
   }

src/components/OverflowMenu/OverflowMenu.js

@@ -124,6 +124,8 @@ export const getMenuOffset = (menuBody, direction) => {
 };
 
 export default class OverflowMenu extends Component {
+  state = {};
+
   static propTypes = {
     /**
      * `true` if the menu should be open.
@@ -308,8 +310,8 @@ export default class OverflowMenu extends Component {
   }
 
   static getDerivedStateFromProps({ open }, state) {
-    const { prevOpen } = state || {};
-    return state && prevOpen === open
+    const { prevOpen } = state;
+    return prevOpen === open
       ? null
       : {
           open,

src/components/PaginationV2/PaginationV2.js

@@ -10,6 +10,19 @@ import { equals } from '../../tools/array';
 let instanceId = 0;
 
 export default class PaginationV2 extends Component {
+  constructor(props) {
+    super(props);
+    const { pageSizes, page, pageSize } = this.props;
+    this.state = {
+      page: page,
+      pageSize:
+        pageSize && pageSizes.includes(pageSize) ? pageSize : pageSizes[0],
+      prevPageSizes: pageSizes,
+      prevPage: page,
+      prevPageSize: pageSize,
+    };
+  }
+
   static propTypes = {
     /**
      * The description for the backward icon.
@@ -131,16 +144,6 @@ export default class PaginationV2 extends Component {
   }
 
   static getDerivedStateFromProps({ pageSizes, page, pageSize }, state) {
-    if (!state) {
-      return {
-        page: page,
-        pageSize:
-          pageSize && pageSizes.includes(pageSize) ? pageSize : pageSizes[0],
-        prevPageSizes: pageSizes,
-        prevPage: page,
-        prevPageSize: pageSize,
-      };
-    }
     const {
       prevPageSizes,
       prevPage,

src/components/ProgressIndicator/ProgressIndicator.js

@@ -75,6 +75,8 @@ ProgressStep.propTypes = {
 };
 
 export class ProgressIndicator extends Component {
+  state = {};
+
   static propTypes = {
     /**
      * Provide <ProgressStep> components to be rendered in the
@@ -98,8 +100,8 @@ export class ProgressIndicator extends Component {
   };
 
   static getDerivedStateFromProps({ currentIndex }, state) {
-    const { prevCurrentIndex } = state || {};
-    return state && prevCurrentIndex === currentIndex
+    const { prevCurrentIndex } = state;
+    return prevCurrentIndex === currentIndex
       ? null
       : {
           currentIndex,