moving things to own files

src/interface/src/app/treatments/map-base-layer/map-base-layer.component.html

@@ -7,6 +7,7 @@
         [value]="t"
         [id]="'layer-' + t"
         name="baseLayer"
+        [checked]="t === defaultLayer"
         (click)="updateBaseLayer(t)" />
       <label [for]="'layer-' + t">{{ t }}</label>
     </div>

src/interface/src/app/treatments/map-base-layer/map-base-layer.component.ts

@@ -1,10 +1,11 @@
 import { Component } from '@angular/core';
+import { NgForOf } from '@angular/common';
 import {
   baseLayerStyles,
   BaseLayerType,
-  MapConfigState,
-} from '../treatment-map/map-config.state';
-import { NgForOf } from '@angular/common';
+  DEFAULT_BASE_MAP,
+} from '../treatment-map/map-base-layers';
+import { MapConfigState } from '../treatment-map/map-config.state';
 
 @Component({
   selector: 'app-map-base-layer',
@@ -15,6 +16,7 @@ import { NgForOf } from '@angular/common';
 })
 export class MapBaseLayerComponent {
   baseLayers = Object.keys(baseLayerStyles) as BaseLayerType[];
+  readonly defaultLayer = DEFAULT_BASE_MAP;
 
   constructor(private mapConfigState: MapConfigState) {}
 

src/interface/src/app/treatments/treatment-map/map-base-layers.ts

@@ -0,0 +1,47 @@
+import { MapOptions } from 'maplibre-gl';
+import { environment } from '../../../environments/environment';
+
+type StadiaBaseMap = 'road';
+type ArcgisRest = 'terrain' | 'satellite';
+
+export const DEFAULT_BASE_MAP: StadiaBaseMap = 'road';
+export type BaseLayerType = StadiaBaseMap | ArcgisRest;
+
+export const baseLayerStyles: Record<BaseLayerType, MapOptions['style']> = {
+  road:
+    'https://tiles.stadiamaps.com/styles/alidade_smooth.json?api_key=' +
+    environment.stadiamaps_key,
+
+  terrain: rasterSource(
+    'worldTerrain',
+    'https://services.arcgisonline.com/ArcGIS/rest/services/World_Terrain_Base/MapServer/tile/{z}/{y}/{x}'
+  ),
+  satellite: rasterSource(
+    'restSatellite',
+    'https://server.arcgisonline.com/ArcGIS/rest/services/World_Imagery/MapServer/tile/{z}/{y}/{x}'
+  ),
+};
+
+function rasterSource(sourceName: string, url: string): MapOptions['style'] {
+  return {
+    version: 8,
+    metadata: {
+      'mapbox:autocomposite': true,
+    },
+    glyphs: 'https://demotiles.maplibre.org/font/{fontstack}/{range}.pbf',
+    sources: {
+      [sourceName]: {
+        type: 'raster',
+        tiles: [url],
+        tileSize: 256,
+      },
+    },
+    layers: [
+      {
+        id: sourceName + '-layer',
+        type: 'raster',
+        source: sourceName,
+      },
+    ],
+  };
+}

src/interface/src/app/treatments/treatment-map/map-config.state.ts

@@ -1,52 +1,10 @@
 import { BehaviorSubject, map } from 'rxjs';
 import { Injectable } from '@angular/core';
-import { environment } from '../../../environments/environment';
-import { MapOptions } from 'maplibre-gl';
-
-type StadiaBaseMap = 'road';
-type ArcgisRest = 'terrain' | 'satellite';
-
-const DEFAULT_BASE_MAP: StadiaBaseMap = 'road';
-export type BaseLayerType = StadiaBaseMap | ArcgisRest;
-
-function rasterSource(sourceName: string, url: string): MapOptions['style'] {
-  return {
-    version: 8,
-    metadata: {
-      'mapbox:autocomposite': true,
-    },
-    glyphs: 'https://demotiles.maplibre.org/font/{fontstack}/{range}.pbf',
-    sources: {
-      [sourceName]: {
-        type: 'raster',
-        tiles: [url],
-        tileSize: 256,
-      },
-    },
-    layers: [
-      {
-        id: sourceName + '-layer',
-        type: 'raster',
-        source: sourceName,
-      },
-    ],
-  };
-}
-
-export const baseLayerStyles: Record<BaseLayerType, MapOptions['style']> = {
-  road:
-    'https://tiles.stadiamaps.com/styles/alidade_smooth.json?api_key=' +
-    environment.stadiamaps_key,
-
-  terrain: rasterSource(
-    'worldTerrain',
-    'https://services.arcgisonline.com/ArcGIS/rest/services/World_Terrain_Base/MapServer/tile/{z}/{y}/{x}'
-  ),
-  satellite: rasterSource(
-    'restSatellite',
-    'https://server.arcgisonline.com/ArcGIS/rest/services/World_Imagery/MapServer/tile/{z}/{y}/{x}'
-  ),
-};
+import {
+  baseLayerStyles,
+  BaseLayerType,
+  DEFAULT_BASE_MAP,
+} from './map-base-layers';
 
 @Injectable()
 export class MapConfigState {