From 532bbecb47d9f8e644666a7771e18193da655b2b Mon Sep 17 00:00:00 2001
From: orangemug <info@orangemug.co.uk>
Date: Sun, 2 Feb 2020 08:05:01 +0000
Subject: [PATCH] Only disable <LayerTypeBlock/> in <LayerEditor/>

---
 src/components/layers/LayerEditor.jsx    |  1 +
 src/components/layers/LayerTypeBlock.jsx | 32 +++++++++++++++++++++---
 2 files changed, 29 insertions(+), 4 deletions(-)

diff --git a/src/components/layers/LayerEditor.jsx b/src/components/layers/LayerEditor.jsx
index 4c82a8f..79b4c16 100644
--- a/src/components/layers/LayerEditor.jsx
+++ b/src/components/layers/LayerEditor.jsx
@@ -154,6 +154,7 @@ export default class LayerEditor extends React.Component {
           onChange={newId => this.props.onLayerIdChange(this.props.layer.id, newId)}
         />
         <LayerTypeBlock
+          disabled={true}
           error={errorData.type}
           value={this.props.layer.type}
           onChange={newType => this.props.onLayerChanged(changeType(this.props.layer, newType))}
diff --git a/src/components/layers/LayerTypeBlock.jsx b/src/components/layers/LayerTypeBlock.jsx
index 4a4b2b3..1c68598 100644
--- a/src/components/layers/LayerTypeBlock.jsx
+++ b/src/components/layers/LayerTypeBlock.jsx
@@ -12,6 +12,11 @@ class LayerTypeBlock extends React.Component {
     wdKey: PropTypes.string,
     onChange: PropTypes.func.isRequired,
     error: PropTypes.object,
+    disabled: PropTypes.bool,
+  }
+
+  static defaultProps = {
+    disabled: false,
   }
 
   render() {
@@ -19,10 +24,29 @@ class LayerTypeBlock extends React.Component {
       data-wd-key={this.props.wdKey}
       error={this.props.error}
     >
-      <StringInput
-        value={this.props.value}
-        disabled={true}
-      />
+      {this.props.disabled &&
+        <StringInput
+          value={this.props.value}
+          disabled={true}
+        />
+      }
+      {!this.props.disabled &&
+        <SelectInput
+          options={[
+            ['background', 'Background'],
+            ['fill', 'Fill'],
+            ['line', 'Line'],
+            ['symbol', 'Symbol'],
+            ['raster', 'Raster'],
+            ['circle', 'Circle'],
+            ['fill-extrusion', 'Fill Extrusion'],
+            ['hillshade', 'Hillshade'],
+            ['heatmap', 'Heatmap'],
+          ]}
+          onChange={this.props.onChange}
+          value={this.props.value}
+        />
+      }
     </InputBlock>
   }
 }