Ensure editor does not crash with raster layers

src/components/icons/LayerIcon.jsx

@@ -16,6 +16,7 @@ class LayerIcon extends React.Component {
     const iconProps = { style: this.props.style }
     switch(this.props.type) {
       case 'fill-extrusion': return <BackgroundIcon {...iconProps} />
+      case 'raster': return <FillIcon {...iconProps} />
       case 'fill': return <FillIcon {...iconProps} />
       case 'background': return <BackgroundIcon {...iconProps} />
       case 'line': return <LineIcon {...iconProps} />

src/components/map/MapboxGlMap.jsx

@@ -93,9 +93,10 @@ export default class MapboxGlMap extends React.Component {
       style={{
         position: "fixed",
         top: 0,
+        left: 550,
         bottom: 0,
         height: "100%",
-        width: "100%",
+        width: "75%",
         ...this.props.style,
       }}>
     </div>

src/libs/apistore.js

@@ -31,12 +31,14 @@ export class ApiStyleStore {
     connection.onmessage = e => {
       if(!e.data) return
       console.log('Received style update from API')
+      let parsedStyle = style.emptyStyle
       try {
-        const updatedStyle = style.ensureStyleValidity(JSON.parse(e.data))
+        parsedStyle = JSON.parse(e.data)
-        this.onLocalStyleChange(updatedStyle)
       } catch(err) {
-        console.error('Could not parse local style')
+        console.error(err)
       }
+      const updatedStyle = style.ensureStyleValidity(parsedStyle)
+      this.onLocalStyleChange(updatedStyle)
     }
   }
 

src/libs/urlopen.js

@@ -4,7 +4,6 @@ import style from './style.js'
 
 export function initialStyleUrl() {
   const initialUrl = url.parse(window.location.href, true)
-  console.log(initialUrl)
   return (initialUrl.query || {}).style
 }