Google Maps InvalidKeyMapError при создании сайта с помощью Gatsby и Netlify

Я создал сайт Gatsby, который использует компонент карт Google, который я взял из пакета npm «google-maps-react». Все отлично работает в моей локальной среде, но когда я развертываю Netlify, я получаю «Ошибка API JavaScript Карт Google: InvalidKeyMapError».

Я прошел все шаги, чтобы убедиться, что мой ключ API зарегистрирован и активирован правильно. Я позаботился о том, чтобы объявить ключ API как переменную среды в пользовательском интерфейсе Netlify, и я обращаюсь к нему в своем компоненте с помощью «process.env.GOOGLE_API_KEY».

import React from "react"
import { Map, InfoWindow, Marker, GoogleApiWrapper } from "google-maps-react"

export class MapContainer extends React.Component {


  render() {

    return (
      <Map google = {this.props.google} zoom = {14} initialCenter = {{lat:37.769461, lng:-122.251831}}>
        <Marker onClick = {this.onMarkerClick} name = {"Current location"} />
        <InfoWindow onClose = {this.onInfoWindowClose}>
          <div>
            ...some code
          </div>
        </InfoWindow>
      </Map>
    )
  }
}

export default GoogleApiWrapper({
    apiKey: (`${process.env.GOOGLE_API_KEY}`)
  })(MapContainer)

Из того, что я прочитал, объявление переменной среды GOOGLE_API_KEY в пользовательском интерфейсе Netlify было всем, что мне нужно было сделать, чтобы иметь к нему доступ, но я явно что-то упускаю. Любая помощь приветствуется, спасибо