Update-angular-19

.eslintrc.json

@@ -33,6 +33,7 @@
                         "style": "camelCase"
                     }
                 ],
+                "@angular-eslint/prefer-standalone": "warn", // TODO: make all components standalone
                 "@typescript-eslint/consistent-type-definitions": "error",
                 "@typescript-eslint/dot-notation": "off",
                 "@typescript-eslint/explicit-member-accessibility": [

README.md

@@ -57,8 +57,8 @@ When the server is started, you can visit `http://localhost:4200/`.
 
 ### Apps
 
--   The default app is the GIS app. It is located in `projects/gis`.
--   Dashboards are located under `projects/dashboards`.
+- The default app is the GIS app. It is located in `projects/gis`.
+- Dashboards are located under `projects/dashboards`.
 
 ## Configuration
 
@@ -115,7 +115,7 @@ You can override any of these default settings by specifying them.
 
 Note:
 
--   For dates before the year 0, 6-digit years must be specified., e.g. '-001000-01-01T12:00:00.000Z'
+- For dates before the year 0, 6-digit years must be specified., e.g. '-001000-01-01T12:00:00.000Z'
 
 _TODO: specify the options of each parameter in a tabular form._
 

package.json

@@ -48,86 +48,82 @@
     },
     "private": true,
     "dependencies": {
-        "@angular/animations": "^18.2.4",
-        "@angular/cdk": "^18.2.4",
-        "@angular/common": "^18.2.4",
-        "@angular/compiler": "^18.2.4",
-        "@angular/core": "^18.2.4",
-        "@angular/forms": "^18.2.4",
-        "@angular/material": "^18.2.4",
-        "@angular/platform-browser": "^18.2.4",
-        "@angular/platform-browser-dynamic": "^18.2.4",
-        "@angular/router": "^18.2.4",
+        "@angular/animations": "^19.1.3",
+        "@angular/cdk": "^19.1.1",
+        "@angular/common": "^19.1.3",
+        "@angular/compiler": "^19.1.3",
+        "@angular/core": "^19.1.3",
+        "@angular/forms": "^19.1.3",
+        "@angular/material": "^19.1.1",
+        "@angular/platform-browser": "^19.1.3",
+        "@angular/platform-browser-dynamic": "^19.1.3",
+        "@angular/router": "^19.1.3",
         "@egjs/hammerjs": "^2.0.17",
         "@geoengine/openapi-client": "0.0.18",
-        "codemirror": "~5.65.16",
+        "codemirror": "~5.65.18",
         "d3": "~7.9.0",
         "dagre": "~0.8.5",
         "dagre-d3": "~0.6.4",
-        "flatgeobuf": "3.35.0",
-        "immutable": "~4.3.7",
+        "flatgeobuf": "3.36.0",
+        "immutable": "~5.0.3",
         "keycharm": "0.4.0",
         "moment": "~2.30.1",
         "ngx-color-picker": "~17.0.0",
-        "ngx-mat-select-search": "~7.0.5",
-        "ol": "~10.1.0",
-        "ol-mapbox-style": "~12.3.5",
-        "proj4": "~2.12.1",
+        "ngx-mat-select-search": "~7.0.10",
+        "ol": "~10.3.1",
+        "ol-mapbox-style": "~12.4.0",
+        "proj4": "~2.15.0",
         "propagating-hammerjs": "^2.0.1",
         "rxjs": "^7.4.0",
         "uuid": "9.0.1",
-        "vega": "~5.30.0",
-        "vega-embed": "~6.26.0",
-        "vega-lite": "~5.21.0",
+        "vega": "~5.31.0",
+        "vega-embed": "~6.27.0",
+        "vega-lite": "~5.23.0",
         "vis-data": "7.1.9",
         "vis-timeline": "7.7.3",
         "vis-util": "5.0.7",
         "xss": "1.0.15",
-        "zone.js": "~0.14.10"
+        "zone.js": "~0.15.0"
     },
     "devDependencies": {
-        "@angular-devkit/architect": "^0.1802.4",
-        "@angular-devkit/build-angular": "^18.2.4",
-        "@angular-eslint/builder": "^18.3.1",
-        "@angular-eslint/eslint-plugin": "^18.3.1",
-        "@angular-eslint/eslint-plugin-template": "^18.3.1",
-        "@angular-eslint/schematics": "^18.3.1",
-        "@angular-eslint/template-parser": "^18.3.1",
-        "@angular/cli": "^18.2.4",
-        "@angular/compiler-cli": "^18.2.4",
-        "@angular/language-service": "^18.2.4",
+        "@angular-devkit/architect": "^0.1901.5",
+        "@angular-devkit/build-angular": "^19.1.5",
+        "@angular-eslint/builder": "^19.0.2",
+        "@angular-eslint/eslint-plugin": "^19.0.2",
+        "@angular-eslint/eslint-plugin-template": "^19.0.2",
+        "@angular-eslint/schematics": "^19.0.2",
+        "@angular-eslint/template-parser": "^19.0.2",
+        "@angular/cli": "^19.1.5",
+        "@angular/compiler-cli": "^19.1.3",
+        "@angular/language-service": "^19.1.3",
         "@types/arcgis-rest-api": "^10.4.8",
         "@types/codemirror": "~5.60.15",
         "@types/d3": "~7.4.3",
         "@types/dagre": "^0.7.52",
         "@types/dagre-d3": "^0.6.6",
-        "@types/jasmine": "~5.1.4",
+        "@types/jasmine": "~5.1.5",
         "@types/jasminewd2": "~2.0.13",
-        "@types/node": "^22.5.4",
-        "@types/proj4": "^2.5.5",
-        "@types/rbush": "3.0.3",
+        "@types/node": "^22.12.0",
+        "@types/proj4": "^2.5.6",
         "@types/topojson-specification": "^1.0.5",
-        "@typescript-eslint/eslint-plugin": "^8.5.0",
-        "@typescript-eslint/parser": "^8.5.0",
-        "eslint": "^8.57.0",
-        "eslint-config-prettier": "^9.1.0",
-        "eslint-plugin-import": "2.30.0",
-        "eslint-plugin-jsdoc": "50.2.2",
+        "@typescript-eslint/eslint-plugin": "^8.22.0",
+        "@typescript-eslint/parser": "^8.22.0",
+        "eslint": "^9.19.0",
+        "eslint-config-prettier": "^10.0.1",
+        "eslint-plugin-import": "2.31.0",
+        "eslint-plugin-jsdoc": "50.6.3",
         "eslint-plugin-prefer-arrow": "1.2.3",
-        "eslint-plugin-prettier": "^5.2.1",
-        "jasmine-core": "~5.3.0",
+        "eslint-plugin-prettier": "^5.2.3",
+        "jasmine-core": "~5.5.0",
         "karma": "~6.4.4",
         "karma-chrome-launcher": "~3.2.0",
         "karma-coverage": "~2.2.1",
         "karma-jasmine": "~5.1.0",
         "karma-jasmine-html-reporter": "~2.1.0",
-        "ng-packagr": "^18.2.1",
-        "prettier": "3.3.3",
-        "puppeteer": "~23.3.0",
+        "ng-packagr": "^19.1.2",
+        "prettier": "3.4.2",
+        "puppeteer": "~24.1.1",
         "ts-node": "~10.9.2",
-        "typescript": "<5.6.0"
-    },
-    "//devDependencies": {
-        "@types/rbush": "// remove this when `ol` is updated"
+        "typescript": "5.7.3"
     }
 }

projects/common/src/lib/colors/color-attribute-input/color-attribute-input.component.ts

@@ -28,6 +28,7 @@ export interface ColorAttributeInputHinter {
     changeDetection: ChangeDetectionStrategy.OnPush,
     providers: [{provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => ColorAttributeInputComponent), multi: true}],
     encapsulation: ViewEncapsulation.Emulated,
+    standalone: false,
 })
 export class ColorAttributeInputComponent implements ControlValueAccessor, OnChanges {
     @Input() readonlyAttribute = false;

projects/common/src/lib/colors/color-breakpoint-input/color-breakpoint-input.component.ts

@@ -13,6 +13,7 @@ import {CommonConfig} from '../../config.service';
     styleUrls: ['./color-breakpoint-input.component.scss'],
     changeDetection: ChangeDetectionStrategy.OnPush,
     providers: [{provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => ColorBreakpointInputComponent), multi: true}],
+    standalone: false,
 })
 export class ColorBreakpointInputComponent implements ControlValueAccessor, OnChanges, OnDestroy {
     @Input() readonlyAttribute = false;

projects/common/src/lib/colors/color-map-selector/color-map-selector.component.ts

@@ -25,6 +25,7 @@ import {ALL_COLORMAPS} from '../colormaps/colormaps';
     templateUrl: 'color-map-selector.component.html',
     styleUrls: ['color-map-selector.component.scss'],
     changeDetection: ChangeDetectionStrategy.OnPush,
+    standalone: false,
 })
 export class ColorMapSelectorComponent implements OnInit, OnDestroy, OnChanges {
     /**

projects/common/src/lib/colors/color-table-editor/color-table-editor.component.ts

@@ -22,6 +22,7 @@ import {ClassificationMeasurement} from '../../layers/measurement';
     templateUrl: './color-table-editor.component.html',
     styleUrls: ['./color-table-editor.component.scss'],
     changeDetection: ChangeDetectionStrategy.OnPush,
+    standalone: false,
 })
 export class ColorTableEditorComponent implements OnInit, OnChanges {
     // Symbology to use for creating color tabs

projects/common/src/lib/colors/percentile-breakpoint-selector/percentile-breakpoint-selector.component.ts

@@ -31,6 +31,7 @@ import {ALL_COLORMAPS} from '../colormaps/colormaps';
     templateUrl: 'percentile-breakpoint-selector.component.html',
     styleUrls: ['percentile-breakpoint-selector.component.scss'],
     changeDetection: ChangeDetectionStrategy.OnPush,
+    standalone: false,
 })
 export class PercentileBreakpointSelectorComponent implements OnInit, OnDestroy, OnChanges {
     @Input({required: true}) band!: string;

projects/common/src/lib/config.service.ts

@@ -1,6 +1,6 @@
 import {Injectable} from '@angular/core';
 import {Configuration, DefaultConfig} from '@geoengine/openapi-client';
-import Immutable from 'immutable';
+import * as Immutable from 'immutable';
 import {mergeWith} from 'immutable';
 
 /**

projects/common/src/lib/datasets/ogr-dataset/ogr-dataset.component.ts

@@ -31,7 +31,6 @@ import {
 
 @Component({
     selector: 'geoengine-ogr-dataset',
-    standalone: true,
     imports: [
         AngularCommonModule,
         MatInputModule,

projects/common/src/lib/dialogs/confirmation/confirmation.component.ts

@@ -5,6 +5,7 @@ import {MAT_DIALOG_DATA, MatDialogRef} from '@angular/material/dialog';
     selector: 'geoengine-confirmation-dialog',
     templateUrl: './confirmation.component.html',
     styleUrl: './confirmation.component.css',
+    standalone: false,
 })
 export class ConfirmationComponent {
     constructor(

projects/common/src/lib/layer-collections/layer-collection-dropdown/layer-collection-dropdown.component.ts

@@ -43,6 +43,7 @@ export enum PathChangeSource {
     templateUrl: './layer-collection-dropdown.component.html',
     styleUrls: ['./layer-collection-dropdown.component.scss'],
     changeDetection: ChangeDetectionStrategy.OnPush,
+    standalone: false,
 })
 export class LayerCollectionDropdownComponent implements OnInit, OnChanges, OnDestroy {
     @Input() root?: ProviderLayerCollectionIdDict = undefined;

projects/common/src/lib/layer-collections/layer-collection-layer-details/layer-collection-layer-details.component.ts

@@ -9,6 +9,7 @@ import {SingleBandRasterColorizer} from '../../symbology/symbology.model';
     templateUrl: './layer-collection-layer-details.component.html',
     styleUrls: ['./layer-collection-layer-details.component.scss'],
     changeDetection: ChangeDetectionStrategy.OnPush,
+    standalone: false,
 })
 export class LayerCollectionLayerDetailsComponent {
     @Input() description: string | undefined;

projects/common/src/lib/layer-collections/layer-collection-layer/layer-collection-layer.component.ts

@@ -19,6 +19,7 @@ import {RasterLayerMetadata, VectorLayerMetadata} from '../../layers/layer-metad
     templateUrl: './layer-collection-layer.component.html',
     styleUrls: ['./layer-collection-layer.component.scss'],
     changeDetection: ChangeDetectionStrategy.OnPush,
+    standalone: false,
 })
 export class LayerCollectionLayerComponent implements OnChanges {
     @Input({required: false}) showLayerToggle = true;

projects/common/src/lib/layer-collections/layer-collection-list/layer-collection-list.component.ts

@@ -51,6 +51,7 @@ export enum CollectionNavigation {
     templateUrl: './layer-collection-list.component.html',
     styleUrls: ['./layer-collection-list.component.scss'],
     changeDetection: ChangeDetectionStrategy.OnPush,
+    standalone: false,
 })
 export class LayerCollectionListComponent implements OnChanges {
     readonly CollectionNavigation = CollectionNavigation;

projects/common/src/lib/layer-collections/layer-collection-navigation/layer-collection-navigation.component.ts

@@ -34,6 +34,7 @@ import {CollectionNavigation, LayerCollectionListComponent} from '../layer-colle
     templateUrl: './layer-collection-navigation.component.html',
     styleUrls: ['./layer-collection-navigation.component.scss'],
     changeDetection: ChangeDetectionStrategy.OnPush,
+    standalone: false,
 })
 export class LayerCollectionNavigationComponent implements OnInit, OnChanges, OnDestroy {
     @Input({required: false}) showLayerToggle = true;

projects/common/src/lib/layer-icons/line-icon/line-icon.component.ts

@@ -19,6 +19,7 @@ export interface LineIconStyle extends IconStyle {
     templateUrl: './line-icon.component.svg',
     styleUrls: ['./line-icon.component.scss'],
     changeDetection: ChangeDetectionStrategy.OnPush,
+    standalone: false,
 })
 export class LineIconComponent {
     // the style to use for the icon

projects/common/src/lib/layer-icons/point-icon/point-icon.component.ts

@@ -20,6 +20,7 @@ export interface PointIconStyle extends IconStyle {
     templateUrl: './point-icon.component.svg',
     styleUrls: ['./point-icon.component.scss'],
     changeDetection: ChangeDetectionStrategy.OnPush,
+    standalone: false,
 })
 export class PointIconComponent {
     // the style to use for the icon

projects/common/src/lib/layer-icons/polygon-icon/polygon-icon.component.ts

@@ -20,6 +20,7 @@ export interface PolygonIconStyle extends IconStyle {
     templateUrl: './polygon-icon.component.svg',
     styleUrls: ['./polygon-icon.component.scss'],
     changeDetection: ChangeDetectionStrategy.OnPush,
+    standalone: false,
 })
 export class PolygonIconComponent {
     // the style to use for the icon

projects/common/src/lib/layer-icons/raster-icon/raster-icon.component.ts

@@ -23,6 +23,7 @@ interface Cell {
     templateUrl: './raster-icon.component.svg',
     styleUrls: ['./raster-icon.component.scss'],
     changeDetection: ChangeDetectionStrategy.OnPush,
+    standalone: false,
 })
 export class RasterIconComponent {
     /** number of cells in x direction */

projects/common/src/lib/layers/layer-metadata.model.ts

@@ -67,8 +67,8 @@ export class VectorLayerMetadata extends LayerMetadata {
         super(spatialReference, time, bbox);
 
         this.dataType = dataType;
-        this.dataTypes = Immutable.Map(dataTypes);
-        this.measurements = Immutable.Map(measurements);
+        this.dataTypes = Immutable.Map(Object.entries(dataTypes));
+        this.measurements = Immutable.Map(Object.entries(measurements));
     }
 
     static override fromDict(dict: VectorResultDescriptorDict): VectorLayerMetadata {

projects/common/src/lib/login/login.component.ts

@@ -23,6 +23,7 @@ enum FormStatus {
     templateUrl: './login.component.html',
     styleUrls: ['./login.component.scss'],
     changeDetection: ChangeDetectionStrategy.OnPush,
+    standalone: false,
 })
 export class LoginComponent implements OnInit, AfterViewInit, OnDestroy {
     readonly FormStatus = FormStatus;

projects/common/src/lib/measurement/measurement.component.ts

@@ -17,6 +17,7 @@ interface AddClassForm {
     selector: 'geoengine-measurement',
     templateUrl: './measurement.component.html',
     styleUrl: './measurement.component.css',
+    standalone: false,
 })
 export class MeasurementComponent {
     @Input() measurement!: Measurement;

projects/common/src/lib/plots/vega-viewer/vega-viewer.component.ts

@@ -21,6 +21,7 @@ import {CommonConfig} from '../../config.service';
     templateUrl: './vega-viewer.component.html',
     styleUrls: ['./vega-viewer.component.scss'],
     changeDetection: ChangeDetectionStrategy.OnPush,
+    standalone: false,
 })
 export class VegaViewerComponent implements OnChanges {
     @Input()

projects/common/src/lib/register/register.component.ts

@@ -16,6 +16,7 @@ import {GeoEngineError} from '../util/errors';
     templateUrl: './register.component.html',
     styleUrls: ['./register.component.scss'],
     changeDetection: ChangeDetectionStrategy.OnPush,
+    standalone: false,
 })
 export class RegisterComponent implements AfterViewInit {
     PASSWORD_MIN_LENGTH = 8;

projects/common/src/lib/symbology/color-param-editor/color-param-editor.component.ts

@@ -15,6 +15,7 @@ import {ColorParam, DerivedColor, StaticColor} from '../symbology.model';
     styleUrls: ['color-param-editor.component.scss'],
     changeDetection: ChangeDetectionStrategy.OnPush,
     providers: [{provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => ColorParamEditorComponent), multi: true}],
+    standalone: false,
 })
 export class ColorParamEditorComponent implements ControlValueAccessor {
     @Input() attributes = new Array<string>();

projects/common/src/lib/symbology/number-param-editor/number-param-editor.component.ts

@@ -11,6 +11,7 @@ import {NumberParam, StaticNumber, DerivedNumber} from '../symbology.model';
     styleUrls: ['number-param-editor.component.scss'],
     changeDetection: ChangeDetectionStrategy.OnPush,
     providers: [{provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => NumberParamEditorComponent), multi: true}],
+    standalone: false,
 })
 export class NumberParamEditorComponent implements ControlValueAccessor {
     @Input() attributes = new Array<string>();

projects/common/src/lib/symbology/raster-gradient-symbology-editor/raster-gradient-symbology-editor.component.ts

@@ -35,6 +35,7 @@ import {PercentileBreakpointSelectorComponent} from '../../colors/percentile-bre
     templateUrl: 'raster-gradient-symbology-editor.component.html',
     styleUrls: ['raster-gradient-symbology-editor.component.scss'],
     changeDetection: ChangeDetectionStrategy.OnPush,
+    standalone: false,
 })
 export class RasterGradientSymbologyEditorComponent implements OnDestroy, OnInit, OnChanges {
     @ViewChild(ColorMapSelectorComponent)

projects/common/src/lib/symbology/raster-multiband-symbology-editor/raster-multiband-symbology-editor.component.ts

@@ -53,6 +53,7 @@ type RgbColorName = 'red' | 'green' | 'blue';
     templateUrl: './raster-multiband-symbology-editor.component.html',
     styleUrls: ['./raster-multiband-symbology-editor.component.scss'],
     changeDetection: ChangeDetectionStrategy.OnPush,
+    standalone: false,
 })
 export class RasterMultibandSymbologyEditorComponent implements OnDestroy {
     private readonly formBuilder = inject(FormBuilder);

projects/common/src/lib/symbology/raster-palette-symbology-editor/raster-palette-symbology-editor.component.ts

@@ -15,6 +15,7 @@ import {Measurement} from '@geoengine/openapi-client';
     templateUrl: 'raster-palette-symbology-editor.component.html',
     styleUrls: ['raster-palette-symbology-editor.component.scss'],
     changeDetection: ChangeDetectionStrategy.OnPush,
+    standalone: false,
 })
 export class RasterPaletteSymbologyEditorComponent implements OnInit, OnChanges {
     @ViewChild(ColorMapSelectorComponent)

projects/common/src/lib/symbology/raster-symbology-editor/raster-symbology-editor.component.ts

@@ -42,6 +42,7 @@ const FAUX_RASTER_SYMBOLOGY = new RasterSymbology(
     templateUrl: 'raster-symbology-editor.component.html',
     styleUrls: ['raster-symbology-editor.component.scss'],
     changeDetection: ChangeDetectionStrategy.OnPush,
+    standalone: false,
 })
 export class RasterSymbologyEditorComponent {
     private readonly workflowsService = inject(WorkflowsService);

projects/common/src/lib/symbology/vector-symbology-editor/vector-symbology-editor.component.ts

@@ -27,6 +27,7 @@ import {WorkflowsService} from '../../workflows/workflows.service';
     templateUrl: 'vector-symbology-editor.component.html',
     styleUrls: ['vector-symbology-editor.component.scss'],
     changeDetection: ChangeDetectionStrategy.OnPush,
+    standalone: false,
 })
 export class VectorSymbologyEditorComponent implements OnChanges, OnInit {
     @Input({required: true}) symbologyWorkflow!: SymbologyWorkflow<VectorSymbology>;