Annotate the rest of the Lifecycle methods

README.md

@@ -8,6 +8,8 @@ Short reference of React.Component lifecycle methods so I don't have to scroll t
 
 #### constructor ()
 
+`constructor () => void`
+
 ```js
 /**
  * Create state and call super
@@ -15,43 +17,47 @@ Short reference of React.Component lifecycle methods so I don't have to scroll t
  * @param {object} props
  */
 constructor (props) {
-	super(props);
+  super(props);
-	this.state = {
+  this.state = {
-		foo: 'bar'
+    foo: 'bar'
-	}
+  }
 }
 ```
 
 #### static getDerivedStateFromProps ()
 
+`static getDerivedStateFromProps (nextProps, prevState) => nextState`
+
 ```js
 /**
- * Props have changed, return the updated state
+ * Props have changed, return the updated state or null
  *
  * @param {object} nextProps - Props for the next render
  * @param {object} prevState - State from previous render
  * @return {object | null} - The change to the state 
  */
 static getDerivedStateFromProps (nextProps, prevState) {
-	// Nothing to update
+  // Nothing to update
-	return null;
+  return null;
   
-	// Set new state
+  // Set new state
-	return {
+  return {
-		foo: 'foobar'
+    foo: 'foobar'
-	};
+  };
 } 
 ``` 
 
 #### componentDidMount ()
 
+`componentDidMount() => void`
+
 ```js
 /**
  * Component mounted, will render soon
  */
 componentDidMount () {
-	// Network calls, state changes, 
+  // Network calls, state changes, 
-	// anything is fair game here
+  // anything is fair game here
 }
 ```
 
@@ -59,6 +65,8 @@ componentDidMount () {
 
 #### shouldComponentUpdate ()
 
+`shouldComponentUpdate (nextProps, nextState) => shouldUpdate (boolean)`
+
 ```js
 /**
  * Hook to control re-render
@@ -68,15 +76,18 @@ componentDidMount () {
  * @return {boolean} - Whether to render this cycle
  */
 shouldComponentUpdate (nextProps, nextState) {
-	// Default in React.Component
+  // Default in React.Component
-	return true;
+  return true;
   
-	// React.PureComponent implements this method
+  // React.PureComponent implements this method
-	// with a shallow compare of props and state
+  // with a shallow compare of props and state
 }
 ```
+
 #### render ()
 
+`render () => JSX`
+
 ```js
 /**
  * Render returned components
@@ -84,19 +95,43 @@ shouldComponentUpdate (nextProps, nextState) {
  * @return {React Element | string | number | Portal | null | boolean}
  */
 render () {
-	return <div />;
+  return <div />;
 }
 ```
+
 #### getSnapshotBeforeUpdate ()
 
-```js
+`getSnapshotBeforeUpdate (prevProps, prevState) => any`
-getSnapshotBeforeUpdate (prevProps, prevState) {
-}
-```
-#### componentDidUpdate ()
 
 ```js
+/**
+ * Get/set DOM values. Return value is passed to componentDidUpdate
+ *
+ * @param {object} prevProps
+ * @param {object} prevState
+ * @return {any}
+ */
+getSnapshotBeforeUpdate (prevProps, prevState) {
+  return {
+    bar: 'foo'
+  };
+}
+```
+
+#### componentDidUpdate ()
+
+`componentDidUpdate (prevProps, prevState, snapshot) => void`
+
+```js
+/**
+ * The component updated, do stuff before the next cycle, like network requests
+ *
+ * @param {object} prevProps
+ * @param {object} prevState
+ * @param {any | undefined} snapshot - output from getSnapshotBeforeUpdate
+ */
 componentDidUpdate (prevProps, prevState, snapshot = undefined) {
+  // Best place to do actions depending on previous props and state
 }
 ```
 
@@ -104,10 +139,15 @@ componentDidUpdate (prevProps, prevState, snapshot = undefined) {
 
 #### componentWillUnmount ()
 
+`componentWillUnmount () => void`
+
 ```js
+/**
+ * Teardown stuff
+ */
 componentWillUnMount () {
-	// Cleanup whatever you need to before the
+  // Cleanup whatever you need to before the
-	// component unmounts
+  // component unmounts
 }
 ```
 
@@ -115,5 +155,19 @@ componentWillUnMount () {
 ## Deprecated
 
 ### UNSAFE_componentWillMount ()
+
+`componentWillMount () => void`
+
+Use [`componentDidMount ()`](#componentdidmount-) instead.
+
 ### UNSAFE_componentWillReceiveProps ()
+
+`componentWillRecieveProps (newProps) => void`
+
+Use [`static getDerivedStateFromProps ()`](#static-getderivedstatefromprops-) instead.
+
 ### UNSAFE_componentWillUpdate ()
+
+`componentWillUpdate (nextProps, nextState) => void`
+
+Use [`componentDidUpdate ()`](#componentdidupdate-) instead.