Warning: Using UNSAFE_componentWillReceiveProps in strict mode

Question

I have tried to add google map to my project and everything works good but i have following warning in my console but don't know why and how to fix it.

"Warning: Using UNSAFE_componentWillReceiveProps in strict mode is not recommended and may indicate bugs in your code. See https://reactjs.org/link/unsafe-component-lifecycles for details.

• Move data fetching code or side effects to componentDidUpdate.
• If you're updating state whenever props change, refactor your code to use memoization techniques or move it to static getDerivedStateFromProps. Learn more at: https://reactjs.org/link/derived-state

Please update the following components: Wrapper"

Below is my code:

import React from 'react'
import { Map, GoogleApiWrapper, Marker } from 'google-maps-react';
const Location = (props) => {
  const mapStyles = {
    width: '60%',
    height: '60%'
  }
  const {google} = props
return (
  
<div className="map-area">
  <h1>Znajdź nas!</h1>
  <Map
  google={google}
  zoom={13}
  initialCenter={{
    lat: 53.188,
    lng: 18.066
  }}
  style={mapStyles}
  >
    <Marker />
  </Map>
</div>);
}

export default GoogleApiWrapper({
  apiKey: ('MY_TOKEN')
})(Location)

Answer 1

It's a problem in the current version of google-maps-react and React's strict mode. See: https://github.com/fullstackreact/google-maps-react/issues/476

You probably shouldn't disable strict mode, so you'll have to either fix the library yourself or wait for someone to do that, then upgrade.