import { createLayerComponent } from '@react-leaflet/core';
import L from 'leaflet';
import 'leaflet.gridlayer.googlemutant';

// Replacement for react-leaflet-google's GoogleLayer (v1-only). The Google Maps
// JS API is already loaded (with the places library) by Gkeys before any Google
// BaseLayer renders, so googlemutant can use window.google.maps directly.
function createGoogleMutant({
  maptype = 'roadmap', opacity, googlekey, ...options
}, ctx) {
  const instance = L.gridLayer.googleMutant({
    type: String(maptype).toLowerCase(),
    ...(opacity != null ? { opacity } : {}),
    ...options
  });
  return { instance, context: { ...ctx } };
}

function updateGoogleMutant(instance, props, prevProps) {
  if (props.opacity != null && props.opacity !== prevProps.opacity) {
    instance.setOpacity(props.opacity);
  }
}

export default createLayerComponent(createGoogleMutant, updateGoogleMutant);