Migrate to react v16.3 lifecycle (#2991)

* Migrate to react v16.3 lifecycle & Add backward compatibility for older React versions

* remove yarn.lock

lib/src/components/ComponentWrapper.tsx

@@ -1,5 +1,6 @@
 import * as React from 'react';
 import * as  _ from 'lodash';
+import * as ReactLifecyclesCompat from 'react-lifecycles-compat';
 
 export class ComponentWrapper {
 
@@ -7,6 +8,12 @@ export class ComponentWrapper {
 
     class WrappedComponent extends React.Component<any, { componentId: string; allProps: {}; }> {
 
+      static getDerivedStateFromProps(nextProps, prevState) {
+        return {
+          allProps: _.merge({}, nextProps, store.getPropsForId(prevState.componentId))
+        };
+      }
+
       private originalComponentRef;
 
       constructor(props) {
@@ -15,11 +22,11 @@ export class ComponentWrapper {
         this._saveComponentRef = this._saveComponentRef.bind(this);
         this.state = {
           componentId: props.componentId,
-          allProps: _.merge({}, props, store.getPropsForId(props.componentId))
+          allProps: {}
         };
       }
 
-      componentWillMount() {
+      componentDidMount() {
         store.setRefForId(this.state.componentId, this);
       }
 
@@ -45,12 +52,6 @@ export class ComponentWrapper {
         }
       }
 
-      componentWillReceiveProps(nextProps) {
-        this.setState({
-          allProps: _.merge({}, nextProps, store.getPropsForId(this.state.componentId))
-        });
-      }
-
       render() {
         return (
           <OriginalComponentClass
@@ -73,6 +74,8 @@ export class ComponentWrapper {
       }
     }
 
+    ReactLifecyclesCompat.polyfill(WrappedComponent);
+
     return WrappedComponent;
   }
 }

package.json

@@ -53,6 +53,7 @@
   "dependencies": {
     "lodash": "4.x.x",
     "prop-types": "15.x.x",
+    "react-lifecycles-compat": "2.0.0",
     "@types/react": "16.x.x",
     "@types/react-native": "0.51.x",
     "@types/lodash": "4.x.x",