`import React, { useEffect, useRef, useState } from "react";
import { Slider } from "antd";
import GoogleMapReact from 'google-map-react';

// const AnyReactComponent = ({ text }: { text: string, lat: number, lng: number }) => (
// <div style={{ width: '100px', background: '#fff' }}>{text}
// );

const MapContent = React.memo((props) => {
return (
<GoogleMapReact
bootstrapURLKeys={{ key: "" }}
center={{
lat: 28.19409,
lng: 112.982279
}}
zoom={3}
// onGoogleApiLoaded={onGoogleApiLoaded}
yesIWantToUseGoogleMapApiInternals
{...props}
>

)
})

const Map: React.FC = React.memo((props) => {
const mapRef = useRef(null);
const [zoom, setZoom] = useState(3);

const onGoogleApiLoaded = ({ map, maps }: { map: any, maps: any }) => {
console.log('reason?')
if (mapRef.current) return;
mapRef.current = map;
};
useEffect(() => {
console.log('render');
});
return (

export default Map;`