Sort band names during plant health export, UI fixes

app/raster_utils.py

@@ -24,7 +24,7 @@ def export_raster_index(input, expression, output):
             except ValueError:
                 pass
 
-        bands_names = ["b{}".format(b) for b in tuple(set(re.findall(r"b(?P<bands>[0-9]{1,2})", expression)))]
+        bands_names = ["b{}".format(b) for b in tuple(sorted(set(re.findall(r"b(?P<bands>[0-9]{1,2})", expression))))]
         rgb = expression.split(",")
 
         arr = dict(zip(bands_names, data))

app/static/app/js/components/Map.jsx

@@ -71,6 +71,12 @@ class Map extends React.Component {
   }
 
   loadImageryLayers(forceAddLayers = false){
+    // Cancel previous requests
+    if (this.tileJsonRequests) {
+        this.tileJsonRequests.forEach(tileJsonRequest => tileJsonRequest.abort());
+        this.tileJsonRequests = [];
+    }
+
     const { tiles } = this.props,
           layerId = layer => {
             const meta = layer[Symbol.for("meta")];
@@ -197,9 +203,11 @@ class Map extends React.Component {
         );
       }, err => {
         if (err){
-          this.setState({error: err.message || JSON.stringify(err)});
-        }
-        resolve();
+          if (err !== "abort"){
+              this.setState({error: err.message || JSON.stringify(err)});
+          }
+          reject();
+        }else resolve();
       });
     });
   }
@@ -409,11 +417,11 @@ https://a.tile.openstreetmap.org/{z}/{x}/{y}.png
     });
 
     if (prevProps.tiles !== this.props.tiles){
-      this.loadImageryLayers();
+      this.loadImageryLayers(true);
     }
 
     if (this.layersControl && (prevState.imageryLayers !== this.state.imageryLayers ||
-                               prevState.overlays !== this.state.overlays)){
+                            prevState.overlays !== this.state.overlays)){
         this.layersControl.update(this.state.imageryLayers, this.state.overlays);
     }
   }

app/static/app/js/css/MapView.scss

@@ -9,7 +9,7 @@
     input[type="range"]{
         margin-left: 4px;
         display: inline-block;
-        width: auto;
+        width: 130px;
         position: relative;
         top: 6px;
     }