Merge branch 'ws2903-sort-tiles-and-planes-checkboxes' into 'development'

WS-2903 Sort tiles and planes checkboxes

See merge request !29

src/app/executions/execution/execution-detail/execution-detail.component.ts

@@ -72,7 +72,9 @@ export class ExecutionDetailComponent implements OnInit, OnDestroy, OnChanges {
         }
         if (this.canSelectPlanes()) {
           this.jobService.getPlanes(job.job_id).subscribe((response: object) => {
-            this.planeKeys = Object.keys(response);
+            // Sort the returned planes before making form controls from them
+            this.planeKeys = Object.keys(response)
+              .sort((a, b) => a.localeCompare(b, undefined, { numeric: true }));
             for (const controlName in this.planesFormGroup.controls) {
               this.planesFormGroup.removeControl(controlName);
             }
@@ -87,11 +89,16 @@ export class ExecutionDetailComponent implements OnInit, OnDestroy, OnChanges {
   }
 
   refreshTiles(newTiles: Tile[]) {
-      this.tiles = new Map<string, Tile>(newTiles.map(tile => {return [tile.name, tile]}));
-      for (const controlName in this.tilesFormGroup.controls) {
-        this.tilesFormGroup.removeControl(controlName);
-      }
-      Array.from(this.tiles.keys()).forEach(tile => this.tilesFormGroup.addControl(tile, new FormControl(true)));
+    // Sort newTiles by name before they're stored on this component
+    this.tiles = new Map<string, Tile>(
+      newTiles
+        .sort((a, b) => a.name.localeCompare(b.name, undefined, { numeric: true }))
+        .map(tile => [tile.name, tile])
+    );
+    for (const controlName in this.tilesFormGroup.controls) {
+      this.tilesFormGroup.removeControl(controlName);
+    }
+    Array.from(this.tiles.keys()).forEach(tile => this.tilesFormGroup.addControl(tile, new FormControl(true)));
   }
 
   copyToClipboard(text: string): void {