(create-react-app) Extra small box in InfoWindow of Google Map API - infowindow

Question

I am trying to create an InfoWindow with Google Map API, but there is always an extra small box with the same class to the big InfoWindow. Any way I can get rid of the small InfoWindow?
Here's the link of the image showing the extra small box
Here's my code. Full code here: https://gist.github.com/juifuhung/c2ca99cfbb20bf53686b8bc57d8a8524
return (
<div style={{ display: "flex" }}>
{console.log(array)}
<GoogleMap
zoom={12}
center={center}
mapContainerClassName="map-container"
>
{array.map((location) => (
<Marker
key={uuidv4()}
icon={location.icon}
position={{ lat: location.lat, lng: location.lng }}
onClick={() => {
setSelected(location);
}}
/>
))}
{selected && (
<InfoWindow
position={{ lat: selected.lat, lng: selected.lng }}
onCloseClick={() => setSelected(null)}
>
<div>
<h1>{selected.title}</h1>
<p>{selected.description}</p>
<FaHeart />
<img src={selected.image} alt="" />
</div>
</InfoWindow>
)}
</GoogleMap>
<p>map</p>
</div>
);
};

Answer 1

Try setting the size for your info window, or there might be a bool to set the small info box into hidden
<InfoWindow
this.state.isOpen &&
<InfoWindow onCloseClick={() => this.setState({isOpen:
false})}>
position={{ lat: selected.lat, lng: selected.lng }}
onCloseClick={() => setSelected(null)}
>
<div>
<h1>{selected.title}</h1>
<p>{selected.description}</p>
<FaHeart />
<img src={selected.image} alt="" />
</div>
</InfoWindow>
But if this is an old api, please update to the latest one
#react-google-maps/api