[ Map, Marker ] WebGL Uncaught Error: Not initialized. - Next js

Thanks for stopping by to let us know something could be better!

---
**PLEASE READ**

If you have a support contract with Google, please create an issue in the [support console](https://cloud.google.com/support/). This will ensure a timely response.

Discover additional support services for the Google Maps Platform, including developer communities, technical guidance, and expert support at the Google Maps Platform [support resources page](https://developers.google.com/maps/support/).

If your bug or feature request is not related to this particular library, please visit the Google Maps Platform [issue trackers](https://developers.google.com/maps/support/#issue_tracker).

Check for answers on StackOverflow with the [google-maps](http://stackoverflow.com/questions/tagged/google-maps) tag.

---

Please be sure to include as much information as possible:

#### Environment details

1. Specify the API at the beginning of the title (for example, "Places: ...")
2. OS type and version
3. Library version and other environment information

#### Steps to reproduce

1. Refresh

#### Code example

_app.tsx
```jsx

```

some_page.tsx
```jsx

console.info(marker, latLng)}
/>


```

Map.tsx
```tsx
import { useDeepCompareEffectForMaps } from "@/hooks/useDeepCompareEffectForMaps";
import React from "react";
import useDeepCompareEffect from "use-deep-compare-effect";

type MapProps = {
style: { [key: string]: string };
onClick?: (e: google.maps.MapMouseEvent) => void;
onIdle?: (map: google.maps.Map) => void;
} & google.maps.MapOptions &
React.PropsWithChildren;

const Map = ({ onClick, onIdle, children, style, ...options }: MapProps) => {
const ref = React.useRef(null);
const [map, setMap] = React.useState();

React.useEffect(() => {
if (ref.current && !map) {
setMap(new window.google.maps.Map(ref.current, options));
}
}, [ref, map]);

useDeepCompareEffectForMaps(() => {
if (map) {
map.setOptions(options);
}
}, [map, options]);

React.useEffect(() => {
if (map) {
["click", "idle"].forEach((eventName) =>
google.maps.event.clearListeners(map, eventName)
);

if (onClick) {
map.addListener("click", onClick);
}

if (onIdle) {
map.addListener("idle", () => onIdle(map));
}
}
}, [map, onClick, onIdle]);
// [END maps_react_map_component_event_hooks]

// [START maps_react_map_component_return]
return (
<>