34 lines
738 B
JavaScript
34 lines
738 B
JavaScript
import React from "react";
|
|
import { useStaticQuery, graphql } from "gatsby";
|
|
import { GoogleApiWrapper, Map } from "google-maps-react";
|
|
|
|
const MapContainer = ({ children, google, height = "300px", ...other }) => (
|
|
<Map
|
|
style={{ height }}
|
|
containerStyle={{ position: "relative", height }}
|
|
google={google}
|
|
{...other}
|
|
>
|
|
{children}
|
|
</Map>
|
|
);
|
|
|
|
export default function CustomMap({ ...other }) {
|
|
const data = useStaticQuery(graphql`
|
|
query {
|
|
site {
|
|
siteMetadata {
|
|
secrets {
|
|
GMAPS_APIKEY
|
|
}
|
|
}
|
|
}
|
|
}
|
|
`);
|
|
|
|
const Wrapper = GoogleApiWrapper({
|
|
apiKey: data.site.siteMetadata.secrets.GMAPS_APIKEY
|
|
})(MapContainer);
|
|
return <Wrapper {...other} />;
|
|
}
|