fix: throw an error if layer or source props is not an Immutable objects

docs/clickable-map.md

@@ -42,7 +42,7 @@ initialState = {
   }
 };
 
-const onClick = (event) => {
+const onClick = event => {
   const feature = event.features[0];
   if (!feature) return;
 
@@ -55,13 +55,13 @@ const onClick = (event) => {
 };
 
 <MapGL
-  style={{ width: "100%", height: "400px" }}
-  mapStyle="mapbox://styles/mapbox/light-v9"
+  style={{ width: '100%', height: '400px' }}
+  mapStyle='mapbox://styles/mapbox/light-v9'
   accessToken={MAPBOX_ACCESS_TOKEN}
   {...state.viewport}
 >
   <Source id='markers' source={state.sources.get('markers')} />
   <Layer layer={state.layers.get('markers')} onClick={onClick} />
   <Layer layer={state.layers.get('highlighted-marker')} />
-</MapGL>
-```
+</MapGL>;
+```

src/components/Layer/index.js

@@ -88,6 +88,11 @@ class Layer extends PureComponent<Props> {
 
   constructor(props: Props) {
     super(props);
+
+    if (!isImmutable(props.layer)) {
+      throw new Error('Provided layer prop is not an Immutable object');
+    }
+
     this._id = props.id || props.layer.get('id', '');
   }
 

src/components/Source/index.js

@@ -18,6 +18,14 @@ class Source extends PureComponent<Props> {
 
   static displayName = 'Source';
 
+  constructor(props: Props) {
+    super(props);
+
+    if (!isImmutable(props.source)) {
+      throw new Error('Provided source prop is not an Immutable object');
+    }
+  }
+
   componentDidMount() {
     const { id, source } = this.props;
     this._map.addSource(id, source.toJS());