diff --git a/web/client/components/TOC/enhancers/tocItemsSettings.js b/web/client/components/TOC/enhancers/tocItemsSettings.js
index c00642303d..00e79e1343 100644
--- a/web/client/components/TOC/enhancers/tocItemsSettings.js
+++ b/web/client/components/TOC/enhancers/tocItemsSettings.js
@@ -27,8 +27,8 @@ export const settingsState = compose(
  * - onSave: triggers onHideSettings
  * Lifecycle:
  * - UNSAFE_componentWillMount: set original and initial settings of current node
- * - componentWillReceiveProps: in case of missing description of node, it sends a get capabilities requiest to retrieve data of layer
- * - componentWillUpdate: check if current settings are not expanded and next are expanded to restore initial and original settings of component
+ * - UNSAFE_componentWillReceiveProps: in case of missing description of node, it sends a get capabilities requiest to retrieve data of layer
+ * - UNSAFE_componentWillUpdate: check if current settings are not expanded and next are expanded to restore initial and original settings of component
  * @memberof enhancers.settingsLifecycle
  * @class
  */
@@ -48,7 +48,7 @@ export const settingsLifecycle = compose(
         }
     }),
     lifecycle({
-        componentWillReceiveProps(newProps) {
+        UNSAFE_componentWillReceiveProps(newProps) {
             // an empty description does not trigger the single layer getCapabilites,
             // it does only for missing description
             const {
@@ -60,7 +60,7 @@ export const settingsLifecycle = compose(
                 onRetrieveLayerData(newProps.element);
             }
         },
-        componentWillUpdate(newProps) {
+        UNSAFE_componentWillUpdate(newProps) {
             const {
                 initialActiveTab = 'general',
                 settings = {},
diff --git a/web/client/components/data/download/DownloadOptions.jsx b/web/client/components/data/download/DownloadOptions.jsx
index 57680e146b..c437310e3d 100644
--- a/web/client/components/data/download/DownloadOptions.jsx
+++ b/web/client/components/data/download/DownloadOptions.jsx
@@ -89,7 +89,7 @@ class DownloadOptions extends React.Component {
         this.props.formatOptionsFetch(this.props.layer);
     };
 
-    componentWillReceiveProps = (newProps) => {
+    UNSAFE_componentWillReceiveProps = (newProps) => {
         if ( !isEqual( this.props.formats, newProps.formats)) {
             const format = get(newProps, "downloadOptions.selectedFormat") || get(head(newProps.formats), "name");
             newProps.onChange("selectedFormat", format);
diff --git a/web/client/components/data/identify/enhancers/identify.js b/web/client/components/data/identify/enhancers/identify.js
index b3fa368e91..837d1f8d1a 100644
--- a/web/client/components/data/identify/enhancers/identify.js
+++ b/web/client/components/data/identify/enhancers/identify.js
@@ -57,7 +57,7 @@ export const identifyHandlers = withHandlers({
 /**
  * Basic identify lifecycle used in Identify plugin with IdentifyContainer component
  * - componentDidMount: show cursor on map as pointer if enabled props is true
- * - componentWillReceiveProps:
+ * - UNSAFE_componentWillReceiveProps:
  *      - changes pointer enable true/false - TODO: move it in an epic
  *      - set index to 0 to when responses are changed to avoid empty view if index is greater than current responses length
  * @memberof components.data.identify.enhancers.identify
@@ -120,7 +120,7 @@ export const identifyLifecycle = compose(
             hideMarker();
             purgeResults();
         },
-        componentWillReceiveProps(newProps) {
+        UNSAFE_componentWillReceiveProps(newProps) {
             const {
                 hideMarker = () => {},
                 purgeResults = () => {},
diff --git a/web/client/components/map/enhancers/mapType.js b/web/client/components/map/enhancers/mapType.js
index 2a1c539f31..80f178c9bb 100644
--- a/web/client/components/map/enhancers/mapType.js
+++ b/web/client/components/map/enhancers/mapType.js
@@ -31,7 +31,7 @@ function mapType(Component) {
             this._isMounted = true;
         }
 
-        componentWillUpdate(newProps) {
+        UNSAFE_componentWillUpdate(newProps) {
             if (newProps.mapType !== this.props.mapType) {
                 this.setPlugins(newProps);
             }
diff --git a/web/client/components/misc/enhancers/stickySupport.jsx b/web/client/components/misc/enhancers/stickySupport.jsx
index f58f640fef..f8a065007b 100644
--- a/web/client/components/misc/enhancers/stickySupport.jsx
+++ b/web/client/components/misc/enhancers/stickySupport.jsx
@@ -66,7 +66,7 @@ export default () => WrappedComponent =>
             this.update(this.props.scrollContainerSelector);
         }
 
-        componentWillReceiveProps(newProps) {
+        UNSAFE_componentWillReceiveProps(newProps) {
             if (this._stickybits
             && (newProps.viewWidth !== this.props.viewWidth
             || newProps.viewHeight !== this.props.viewHeight)) {
diff --git a/web/client/libs/numeric-input/NumericInput.jsx b/web/client/libs/numeric-input/NumericInput.jsx
index 74d605e193..82f2cbeb71 100644
--- a/web/client/libs/numeric-input/NumericInput.jsx
+++ b/web/client/libs/numeric-input/NumericInput.jsx
@@ -192,7 +192,7 @@ class NumericInput extends Component {
      *     2. Then trim it.
      *     3. Then parse it to number (delegating to this.props.parse if any)
      */
-    componentWillReceiveProps(props) {
+    UNSAFE_componentWillReceiveProps(props) {
         this._isStrict = !!props.strict;
         let nextState = this._propsToState(props);
         if (Object.keys(nextState).length) {
@@ -206,7 +206,7 @@ class NumericInput extends Component {
     /**
      * Save the input selection right before rendering
      */
-    componentWillUpdate() {
+    UNSAFE_componentWillUpdate() {
         this.saveSelection();
     }