fix(AutoControlledComponent): use setState instead of an assign (#1799)

* fix(AutoControlledComponent): use setState instead of an assign * refactor(ACC): rename initialState to getInitialState
Semantic-Org · Jun 26, 2017 · dbc3b00 · dbc3b00
1 parent 6da73f4
commit dbc3b00
Show file tree

Hide file tree

Showing 11 changed files with 13 additions and 26 deletions.
diff --git a/src/addons/Portal/Portal.js b/src/addons/Portal/Portal.js
@@ -136,8 +136,6 @@ class Portal extends Component {
     type: META.TYPES.ADDON,
   }
 
-  state = {}
-
   componentDidMount() {
     debug('componentDidMount()')
     this.renderPortal()

diff --git a/src/lib/AutoControlledComponent.js b/src/lib/AutoControlledComponent.js
@@ -68,8 +68,11 @@ export const getAutoControlledStateValue = (propName, props, state, includeDefau
 }
 
 export default class AutoControlledComponent extends Component {
-  componentWillMount() {
+  constructor(...args) {
+    super(...args)
+
     const { autoControlledProps } = this.constructor
+    const state = _.invoke(this, 'getInitialState', this.props) || {}
 
     if (process.env.NODE_ENV !== 'production') {
       const { defaultProps, name, propTypes } = this.constructor
@@ -130,7 +133,7 @@ export default class AutoControlledComponent extends Component {
     // Also look for the default prop for any auto controlled props (foo => defaultFoo)
     // so we can set initial values from defaults.
     const initialAutoControlledState = autoControlledProps.reduce((acc, prop) => {
-      acc[prop] = getAutoControlledStateValue(prop, this.props, this.state, true)
+      acc[prop] = getAutoControlledStateValue(prop, this.props, state, true)
 
       if (process.env.NODE_ENV !== 'production') {
         const defaultPropName = getDefaultPropName(prop)
@@ -146,7 +149,7 @@ export default class AutoControlledComponent extends Component {
       return acc
     }, {})
 
-    this.state = { ...this.state, ...initialAutoControlledState }
+    this.state = { ...state, ...initialAutoControlledState }
   }
 
   componentWillReceiveProps(nextProps) {

diff --git a/src/modules/Accordion/Accordion.js b/src/modules/Accordion/Accordion.js
@@ -95,13 +95,8 @@ export default class Accordion extends Component {
   static Content = AccordionContent
   static Title = AccordionTitle
 
-  state = {}
-
-  constructor(...args) {
-    super(...args)
-    this.state = {
-      activeIndex: this.props.exclusive ? -1 : [-1],
-    }
+  getInitialState({ exclusive }) {
+    return { activeIndex: exclusive ? -1 : [-1] }
   }
 
   handleTitleClick = (e, index) => {

diff --git a/src/modules/Checkbox/Checkbox.js b/src/modules/Checkbox/Checkbox.js
@@ -128,8 +128,6 @@ export default class Checkbox extends Component {
     type: META.TYPES.MODULE,
   }
 
-  state = {}
-
   componentDidMount() {
     this.setIndeterminate()
   }

diff --git a/src/modules/Dropdown/Dropdown.js b/src/modules/Dropdown/Dropdown.js
@@ -358,7 +358,6 @@ export default class Dropdown extends Component {
   static Menu = DropdownMenu
 
   componentWillMount() {
-    if (super.componentWillMount) super.componentWillMount()
     debug('componentWillMount()')
     const { open, value } = this.state
 

diff --git a/src/modules/Embed/Embed.js b/src/modules/Embed/Embed.js
@@ -106,8 +106,6 @@ export default class Embed extends Component {
     type: META.TYPES.MODULE,
   }
 
-  state = {}
-
   getSrc() {
     const {
       autoplay = true,

diff --git a/src/modules/Modal/Modal.js b/src/modules/Modal/Modal.js
@@ -143,8 +143,6 @@ class Modal extends Component {
   static Description = ModalDescription
   static Actions = ModalActions
 
-  state = {}
-
   componentWillUnmount() {
     debug('componentWillUnmount()')
     this.handlePortalUnmount()

diff --git a/src/modules/Search/Search.js b/src/modules/Search/Search.js
@@ -196,7 +196,6 @@ export default class Search extends Component {
   static Results = SearchResults
 
   componentWillMount() {
-    if (super.componentWillMount) super.componentWillMount()
     debug('componentWillMount()')
     const { open, value } = this.state
 

diff --git a/src/modules/Sidebar/Sidebar.js b/src/modules/Sidebar/Sidebar.js
@@ -57,11 +57,8 @@ class Sidebar extends Component {
   }
 
   static Pushable = SidebarPushable
-
   static Pusher = SidebarPusher
 
-  state = {}
-
   startAnimating = (duration = 500) => {
     clearTimeout(this.stopAnimatingTimer)
 

diff --git a/src/modules/Tab/Tab.js b/src/modules/Tab/Tab.js
@@ -74,8 +74,8 @@ class Tab extends Component {
 
   static Pane = TabPane
 
-  state = {
-    activeIndex: 0,
+  getInitialState() {
+    return { activeIndex: 0 }
   }
 
   handleItemClick = (e, { index }) => {

diff --git a/test/specs/lib/AutoControlledComponent-test.js b/test/specs/lib/AutoControlledComponent-test.js
@@ -12,7 +12,9 @@ let TestClass
 const createTestClass = (options = {}) => class Test extends AutoControlledComponent {
   static autoControlledProps = options.autoControlledProps
   static defaultProps = options.defaultProps
-  state = options.state
+  getInitialState() {
+    return options.state
+  }
   render = () => <div />
 }
 /* eslint-enable */