CI: switch to Woodpecker

.forgejo/workflows/build.yaml

@@ -1,107 +0,0 @@
-on:
-  push:
-  workflow_dispatch:
-    inputs:
-      build:
-        description: "Build container"
-        required: true
-        default: false
-        type: boolean
-
-jobs:
-  build:
-    runs-on: container
-    steps:
-      - uses: actions/checkout@v4
-        with:
-          fetch-depth: 0
-
-      - name: Get the version from git
-        id: version
-        run: echo "version=$(git describe --dirty --tags)" >> $GITHUB_OUTPUT
-
-      - name: Check if the container should be built
-        id: builder
-        env:
-          RUN: ${{ toJSON(inputs.build || !contains(steps.version.outputs.version, '-')) }}
-        run: |
-          echo "run=$RUN" >> $GITHUB_OUTPUT
-          echo "Run build: $RUN"
-
-      - name: Info - version and if the image container should be built
-        env:
-          VERSION: ${{ steps.version.outputs.version }}
-          RUN: ${{ steps.builder.outputs.run }}
-          FORCE: ${{ toJSON(inputs.build) }}
-        run: |
-          echo "Version $VERSION, force (manual input): $FORCE, run the build: $RUN"
-
-      - uses: pnpm/action-setup@v4
-        name: Install pnpm
-        with:
-          run_install: false
-
-      - name: Install Node.js
-        uses: actions/setup-node@v4
-        with:
-          node-version: 20
-          cache: "pnpm"
-
-      - name: Install dependencies
-        run: pnpm install
-
-      - name: Update version.json from git describe
-        run: pnpm run version
-
-      - name: Set the version in package.json
-        env:
-          VERSION: ${{ steps.version.outputs.version }}
-        run: sed "s/0.0.0/${VERSION}/" -i package.json
-
-      - name: Build package (transpile ts => js)
-        run: ng build
-
-      - name: Set registry token for pnpm"
-        env:
-          LOCAL_NPM_TOKEN: ${{ secrets.LOCAL_NPM_TOKEN }}
-        run: pnpm set "//code.philo.ydns.eu/api/packages/philorg/npm/:_authToken=${LOCAL_NPM_TOKEN}"
-
-      - name: Publish
-        if: fromJSON(steps.builder.outputs.run)
-        run: pnpm publish --no-git-checks
-
-      - name: Build container
-        if: fromJSON(steps.builder.outputs.run)
-        uses: actions/buildah-build@v1
-        with:
-          image: gisaf-frontend
-          oci: true
-          labels: gisaf-frontend
-          tags: latest ${{ steps.version.outputs.version }}
-          containerfiles: |
-            ./Containerfile
-          build-args: |
-            APP_VERSION=${{ steps.version.outputs.version }}
-
-      - name: Workaround for bug of podman-login
-        if: fromJSON(steps.builder.outputs.run)
-        run: |
-          mkdir -p $HOME/.docker
-          echo "{ \"auths\": {} }" > $HOME/.docker/config.json
-
-      - name: Log in to container registry (with another workaround)
-        if: fromJSON(steps.builder.outputs.run)
-        uses: actions/podman-login@v1
-        with:
-          registry: ${{ vars.REGISTRY }}
-          username: ${{ secrets.REGISTRY_USER }}
-          password: ${{ secrets.REGISTRY_PASSWORD }}
-          auth_file_path: /tmp/auth.json
-
-      - name: Push the image to the registry
-        if: fromJSON(steps.builder.outputs.run)
-        uses: actions/push-to-registry@v2
-        with:
-          registry: "docker://${{ vars.REGISTRY }}/${{ vars.ORGANISATION }}"
-          image: gisaf-frontend
-          tags: latest ${{ steps.version.outputs.version }}

.woodpecker/build.yaml

@@ -0,0 +1,50 @@
+when:
+  - event: manual
+  - event: tag
+
+#depends_on:
+  #- test
+
+steps:
+  npm:
+    image: code.philo.ydns.eu/philorg/pnpm-deb
+    environment:
+      ORG: philorg
+      REGISTRY_TOKEN:
+        from_secret: registry_token
+    volumes:
+      - pnpm:/root/.local/share/pnpm
+    commands:
+      - pnpm install --frozen-lockfile
+      - pnpm set "//code.philo.ydns.eu/api/packages/$ORG/npm/:_authToken=$REGISTRY_TOKEN"
+      - pnpm publish --no-git-checks
+    failure: ignore
+
+  build:
+    image: code.philo.ydns.eu/philorg/pnpm-deb
+    commands:
+      - pnpm build
+
+  build_publish:
+    image: quay.io/podman/stable:latest
+    # Caution: This image is built daily. It might fill up your image store quickly.
+    #pull: true
+    volumes:
+      - containers:/var/lib/containers
+      - pnpm:/root/.local/share/pnpm
+    # Fill in the trusted checkbox in Woodpecker's settings as well
+    privileged: true
+    environment:
+      registry: code.philo.ydns.eu
+      org: philorg
+      container_name: gisaf-frontend
+      registry_token:
+        from_secret: registry_token
+    commands:
+      # Login at the registry
+      - podman login -u __token__ --password $registry_token $registry
+      # Build the container image
+      - podman build --volume=/var/lib/containers:/var/lib/containers --tag $registry/$org/$container_name:latest --tag $registry/$org/$container_name:$CI_COMMIT_TAG  .
+      # Push the image
+      - podman push $registry/$org/$container_name:latest
+      - podman push $registry/$org/$container_name:$CI_COMMIT_TAG

Containerfile

@@ -0,0 +1,7 @@
+# Build: podman build -t code.philo.ydns.eu/philorg/gisaf-frontend -f Containerfile
+FROM docker.io/library/nginx:alpine
+
+EXPOSE 80
+
+COPY nginx.conf /etc/nginx/nginx.conf
+COPY dist/gisaf/browser /usr/share/nginx/html

README.md

@@ -1,31 +1,7 @@
-# GisafApp
+# Gisaf frontend
 
-This project was generated with [angular-cli](https://github.com/angular/angular-cli) version 1.0.0-beta.24.
+The web app (front-end, user interface) for Gisaf,
+a web based GIS initially developed for CSR Geomatics, Auroville.
 
-## Development server
+See the [Gisaf server repository](https://code.philo.ydns.eu/philorg/gisaf-backend)
-Run `ng serve` for a dev server. Navigate to `http://localhost:4200/`. The app will automatically reload if you change any of the source files.
+for information about this project.
-
-## Code scaffolding
-
-Run `ng generate component component-name` to generate a new component. You can also use `ng generate directive/pipe/service/class/module`.
-
-## Build
-
-Run `ng build` to build the project. The build artifacts will be stored in the `dist/` directory. Use the `-prod` flag for a production build.
-
-## Running unit tests
-
-Run `ng test` to execute the unit tests via [Karma](https://karma-runner.github.io).
-
-## Running end-to-end tests
-
-Run `ng e2e` to execute the end-to-end tests via [Protractor](http://www.protractortest.org/).
-Before running the tests make sure you are serving the app via `ng serve`.
-
-## Deploying to Github Pages
-
-Run `ng github-pages:deploy` to deploy to Github Pages.
-
-## Further help
-
-To get more help on the `angular-cli` use `ng help` or go check out the [Angular-CLI README](https://github.com/angular/angular-cli/blob/master/README.md).

angular.json

@@ -1,34 +1,49 @@
 {
+  "$schema": "./node_modules/@angular/cli/lib/config/schema.json",
   "version": 1,
   "newProjectRoot": "projects",
   "projects": {
-    "gisaf-app": {
+    "gisaf": {
-      "root": "",
       "projectType": "application",
+      "schematics": {
+        "@schematics/angular:component": {
+          "style": "scss"
+        },
+        "@schematics/angular:application": {
+          "strict": true
+        }
+      },
+      "root": "",
+      "sourceRoot": "src",
+      "prefix": "app",
       "architect": {
         "build": {
-          "builder": "@angular-devkit/build-angular:browser",
+          "builder": "@angular-devkit/build-angular:application",
           "options": {
-            "outputPath": "dist",
+            "outputPath": {
+              "base": "dist/gisaf"
+            },
             "index": "src/index.html",
-            "main": "src/main.ts",
+            "polyfills": [
-            "tsConfig": "src/tsconfig.app.json",
+              "src/polyfills.ts"
-            "polyfills": "src/polyfills.ts",
+            ],
+            "tsConfig": "tsconfig.json",
+            "inlineStyleLanguage": "scss",
             "assets": [
               {
                 "glob": "**/*",
-                "input": "src/assets",
+                "input": "src/assets/",
-                "output": "/assets"
+                "output": "/assets/"
               },
               {
                 "glob": "favicon.ico",
-                "input": "src",
+                "input": "src/",
                 "output": "/"
               },
               {
                 "glob": "**/*",
-                "input": "src/undefined",
+                "input": "src/data/",
-                "output": "/"
+                "output": "/data/"
               }
             ],
             "styles": [
@@ -62,9 +77,8 @@
               "maplibre-gl",
               "@mapbox/point-geometry"
             ],
-            "vendorChunk": true,
+            "browser": "src/main.ts",
             "extractLicenses": false,
-            "buildOptimizer": false,
             "sourceMap": true,
             "optimization": false,
             "namedChunks": true
@@ -78,21 +92,26 @@
                 }
               ],
               "optimization": true,
-              "outputHashing": "all",
               "sourceMap": false,
               "namedChunks": false,
               "extractLicenses": true,
-              "vendorChunk": false,
-              "buildOptimizer": true,
               "fileReplacements": [
                 {
-                  "src": "src/environments/environment.ts",
+                  "replace": "src/environments/environment.ts",
-                  "replaceWith": "src/environments/environment.prod.ts"
+                  "with": "src/environments/environment.prod.ts"
-                }
-              ]
                 }
+              ],
+              "outputHashing": "all"
+            },
+            "development": {
+              "optimization": false,
+              "extractLicenses": false,
+              "sourceMap": true,
+              "namedChunks": true
             }
           },
+          "defaultConfiguration": "production"
+        },
         "serve": {
           "builder": "@angular-devkit/build-angular:dev-server",
           "options": {
@@ -101,23 +120,27 @@
           },
           "configurations": {
             "production": {
-              "buildTarget": "gisaf-app:build:production"
+              "buildTarget": "gisaf:build:production"
-            }
+            },
+            "development": {
+              "buildTarget": "gisaf:build:development"
             }
           },
+          "defaultConfiguration": "development"
+        },
         "extract-i18n": {
           "builder": "@angular-devkit/build-angular:extract-i18n",
           "options": {
-            "buildTarget": "gisaf-app:build"
+            "buildTarget": "gisaf:build"
           }
         },
         "test": {
           "builder": "@angular-devkit/build-angular:karma",
           "options": {
             "main": "src/test.ts",
-            "karmaConfig": "./karma.conf.js",
             "polyfills": "src/polyfills.ts",
-            "tsConfig": "src/tsconfig.spec.json",
+            "tsConfig": "tsconfig.spec.json",
+            "karmaConfig": "karma.conf.js",
             "scripts": [],
             "styles": [
               {
@@ -180,6 +203,7 @@
     }
   },
   "cli": {
-    "analytics": false
+    "analytics": false,
+    "packageManager": "pnpm"
   }
 }

nginx.conf

@@ -0,0 +1,158 @@
+events {
+  worker_connections  1024;  ## Default: 1024
+}
+
+http {
+  include /etc/nginx/mime.types;
+
+  upstream backend {
+    server gisaf-backend:8898 fail_timeout=0;
+    # fail_timeout=0 means we always retry an upstream even if it failed
+    # to return a good HTTP response
+
+    # Unix domain servers
+    # server unix:/tmp/backend-gisaf-1.sock fail_timeout=0;
+  }
+
+  map $http_upgrade $connection_upgrade {
+      default upgrade;
+      '' close;
+  }
+#
+#upstream websocket {
+#    server localhost:8080;
+#}
+
+
+  server {
+      listen 80 default_server;
+      listen [::]:80 default_server;
+
+      gzip on;
+      gzip_types      text/plain application/xml;
+      gzip_proxied    no-cache no-store private expired auth;
+      gzip_min_length 1000;
+
+      charset utf-8;
+
+      client_max_body_size 4G;
+
+      root /usr/share/nginx/html;
+
+      location /tiles/ {
+        # proxy_pass http://localhost:8080/;
+        #proxy_pass http://127.0.0.1:3000/;
+        proxy_pass http://backend;
+      }
+
+      location /api/ {
+        proxy_set_header Host $http_host;
+        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
+        proxy_http_version 1.1;
+        proxy_buffering off;
+        proxy_pass http://backend;
+      }
+
+      location /gj/live {
+        proxy_pass http://backend;
+        proxy_http_version 1.1;
+        proxy_set_header Upgrade "websocket";
+        proxy_set_header Connection "Upgrade";
+        proxy_buffering off;
+      }
+
+      location /_sched {
+        proxy_pass http://localhost:8080;
+        proxy_http_version 1.1;
+        proxy_set_header Upgrade "websocket";
+        proxy_set_header Connection "Upgrade";
+        proxy_buffering off;
+      }
+
+      location /gj/ {
+        proxy_set_header Host $http_host;
+        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
+        proxy_http_version 1.1;
+        proxy_buffering off;
+        proxy_pass http://backend;
+      }
+
+      location /auth {
+        ## POST requests for JWT
+        proxy_set_header Host $http_host;
+        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
+        proxy_http_version 1.1;
+        proxy_buffering off;
+        proxy_pass http://backend;
+      }
+
+#    location /admin {
+#      proxy_set_header Host $http_host;
+#      proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
+#      proxy_http_version 1.1;
+#      proxy_buffering off;
+#      proxy_pass http://backend;
+#    }
+
+      location /import/ {
+        proxy_set_header Host $http_host;
+        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
+        proxy_http_version 1.1;
+        proxy_buffering off;
+        proxy_pass http://backend;
+      }
+
+      location /download/ {
+        proxy_set_header Host $http_host;
+        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
+        proxy_http_version 1.1;
+        proxy_buffering off;
+        proxy_pass http://backend;
+      }
+
+      location /upload/ {
+        proxy_set_header Host $http_host;
+        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
+        proxy_http_version 1.1;
+        proxy_buffering off;
+        proxy_pass http://backend;
+      }
+
+      location /embed/ {
+        proxy_set_header Host $http_host;
+        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
+        proxy_http_version 1.1;
+        proxy_buffering off;
+        proxy_pass http://backend;
+      }
+
+      location = /index.html {
+          root /usr/share/nginx/html;
+      }
+
+      location / {
+          try_files $uri /index.html;
+      }
+
+      location /dashboard-attachment {
+          alias /home/phil/gisaf_misc/notebooks;
+      }
+
+      location = /favicon.ico {
+          root /usr/share/nginx/html;
+      }
+
+#    location /terrain {
+#        proxy_pass             https://stamen-tiles-a.a.ssl.fastly.net/terrain;
+#        #proxy_set_header       Host $host;
+#        proxy_buffering        on;
+#        proxy_cache            STAMEN;
+#        proxy_cache_valid      200  1d;
+#        proxy_cache_use_stale  error timeout invalid_header updating http_500 http_502 http_503 http_504;
+#    }
+
+#    location "/download/attachment/formidable:trees/Picture/" {
+#    	alias /home/phil/formidable_src/local_data/;
+#    }
+  }
+}

package.json

@@ -1,7 +1,7 @@
 {
   "name": "gisaf-frontend",
   "displayName": "Gisaf web front-end",
-  "version": "0.0.0",
+  "version": "0.5.0",
   "license": "GPL-3.0",
   "description": "Gisaf Geomatics",
   "repository": {
@@ -12,12 +12,12 @@
   "angular-cli": {},
   "scripts": {
     "ng": "ng",
-    "start": "node --max_old_space_size=4096 ./node_modules/@angular/cli/bin/ng serve --proxy-config proxy.conf.json --watch",
+    "start": "node --max_old_space_size=4096 ./node_modules/@angular/cli/bin/ng serve --proxy-config proxy.conf.json --host 0.0.0.0 --watch",
     "build": "node --max_old_space_size=4096 ./node_modules/@angular/cli/bin/ng build",
     "test": "ng test",
     "lint": "ng lint",
     "e2e": "ng e2e",
-    "openapi-ts": "openapi-ts -i http://127.0.0.1:5000/openapi.json -o src/app/openapi --client angular",
+    "openapi-ts": "openapi-ts -i http://127.0.0.1:5080/openapi.json -o src/app/openapi --client angular",
     "source-map-explorer": "source-map-explorer dist/*.js"
   },
   "licenses": [
@@ -26,56 +26,54 @@
       "url": "https://github.com/angular/angular.io/blob/master/LICENSE"
     }
   ],
-  "private": true,
   "dependencies": {
-    "@angular/animations": "^17.3.5",
+    "@angular/animations": "^18.2.13",
-    "@angular/cdk": "^17.3.5",
+    "@angular/cdk": "^18.2.14",
-    "@angular/common": "^17.3.5",
+    "@angular/common": "^18.2.13",
-    "@angular/compiler": "^17.3.5",
+    "@angular/compiler": "^18.2.13",
-    "@angular/core": "^17.3.5",
+    "@angular/core": "^18.2.13",
-    "@angular/forms": "^17.3.5",
+    "@angular/forms": "^18.2.13",
-    "@angular/material": "^17.3.5",
+    "@angular/material": "^18.2.14",
-    "@angular/platform-browser": "^17.3.5",
+    "@angular/platform-browser": "^18.2.13",
-    "@angular/platform-browser-dynamic": "^17.3.5",
+    "@angular/platform-browser-dynamic": "^18.2.13",
-    "@angular/platform-server": "^17.3.5",
+    "@angular/platform-server": "^18.2.13",
-    "@angular/router": "^17.3.5",
+    "@angular/router": "^18.2.13",
     "@mapbox/point-geometry": "^0.1.0",
-    "@maplibre/ngx-maplibre-gl": "^17.4.3",
+    "@maplibre/ngx-maplibre-gl": "^18.1.4",
     "@turf/bbox": "^7.1.0",
     "@turf/distance": "^7.1.0",
     "@turf/helpers": "^7.1.0",
     "angular-plotly.js": "^5.2.2",
-    "maplibre-gl": "^4.1.3",
+    "maplibre-gl": "^4.7.1",
-    "ngx-flexible-layout": "~17.0.4",
+    "ngx-flexible-layout": "~18.0.2",
     "plotly.js-basic-dist-min": "2.31.1",
     "rxjs": "^7.8.1",
     "ts-helpers": "^1.1.2",
-    "zone.js": "~0.14.4"
+    "zone.js": "~0.14.10"
   },
   "devDependencies": {
-    "@angular-devkit/build-angular": "^17.3.5",
+    "@angular-devkit/build-angular": "^18.2.12",
-    "@angular/cli": "^17.3.5",
+    "@angular/cli": "^18.2.12",
-    "@angular/compiler-cli": "^17.3.5",
+    "@angular/compiler-cli": "^18.2.13",
-    "@angular/language-service": "^17.3.5",
+    "@angular/language-service": "^18.2.13",
-    "@hey-api/openapi-ts": "^0.45",
+    "@hey-api/openapi-ts": "^0.45.1",
-    "@types/geojson": "^7946.0.14",
+    "@types/geojson": "^7946.0.15",
-    "@types/jasmine": "~5.1.4",
+    "@types/jasmine": "~5.1.5",
     "@types/jasminewd2": "^2.0.13",
-    "@types/node": "^20.12.7",
+    "@types/node": "^20.17.10",
     "@types/plotly.js-dist-min": "^2.3.4",
-    "codelyzer": "^6.0.2",
     "eslint": "^9.17.0",
     "fontnik": "^0.7.2",
     "jasmine-core": "~5.1.2",
     "jasmine-spec-reporter": "~7.0.0",
-    "karma": "~6.4.3",
+    "karma": "~6.4.4",
     "karma-chrome-launcher": "~3.2.0",
     "karma-cli": "^2.0.0",
     "karma-coverage-istanbul-reporter": "~3.0.3",
     "karma-jasmine": "~5.1.0",
     "source-map-explorer": "^2.5.3",
     "ts-node": "^10.9.2",
-    "tslib": "^2.6.2",
+    "tslib": "^2.8.1",
     "typescript": "~5.4.5"
   },
   "packageManager": "pnpm@9.15",

proxy.conf.json

@@ -7,7 +7,7 @@
       "/docs",
       "/api"
     ],
-      "target": "http://127.0.0.1:5000",
+    "target": "http://127.0.0.1:5080",
     "secure": false,
     "ws": true
   },

src/app/admin/admin-manage/access/role-dialog.component.ts

@@ -12,7 +12,6 @@ export interface DialogData {
 @Component({
   selector: 'gisaf-admin-access-role-dialog',
   templateUrl: 'role-dialog.component.html',
-    styleUrls: ['role-dialog.component.css'],
 })
 export class GisafAdminAccessRoleDialogComponent implements OnInit {
   formGroup: UntypedFormGroup = new UntypedFormGroup({})

src/app/admin/admin-manage/maintenance/maintenance.component.ts

@@ -7,7 +7,6 @@ import { AdminManageDataService } from '../data.service'
 @Component({
   selector: 'gisaf-admin-maintenance',
   templateUrl: './maintenance.component.html',
-    styleUrls: ['./maintenance.component.css'],
   changeDetection: ChangeDetectionStrategy.OnPush,
 })
 export class AdminMaintenanceComponent implements OnInit {

src/app/app.component.html

@@ -2,7 +2,7 @@
     <mat-toolbar fxFlex="2em" id='top-toolbar'>
         <span
             style='font-family:GisafSymbols'
-            matTooltip="Gisaf v. {{ (configService.conf | async).bsData?.version }}"
+            matTooltip="Gisaf version: backend {{ version.backend }}, frontend {{ version.frontend }}"
             matTooltipPosition="below"
             class='gisafIcon'
             >

src/app/app.component.ts

@@ -1,5 +1,7 @@
-import { Component, OnInit,
+import {
-    ChangeDetectionStrategy, ChangeDetectorRef } from '@angular/core'
+  Component, OnInit,
+  ChangeDetectionStrategy, ChangeDetectorRef
+} from '@angular/core'
 import { Title } from '@angular/platform-browser'
 import { BootstrapService } from './_services/bootstrap.service'
 import { ConfigService } from './_services/config.service'
@@ -8,6 +10,12 @@ import { MatDialog, MatDialogRef } from '@angular/material/dialog'
 
 import { AuthenticationService } from './_services/authentication.service'
 import { LoginDialogComponent } from './login/login.component'
+import packageJson from '../../package.json'
+
+export class Version {
+  public backend: string
+  public frontend: string
+}
 
 @Component({
   selector: 'app-root',
@@ -16,8 +24,8 @@ import { LoginDialogComponent } from './login/login.component'
   changeDetection: ChangeDetectionStrategy.OnPush,
 })
 export class AppComponent implements OnInit {
-    title = 'Gisaf'
+  title: string = 'Gisaf'
-    version: string
+  version: Version = new Version()
 
   routes = [
     {
@@ -52,7 +60,8 @@ export class AppComponent implements OnInit {
     // Bootstrap: set app wide configuration
     this.bootstrapService.get().subscribe({
       next: res => {
-                this.version = res.version
+        this.version.backend = res.version
+        this.version.frontend = packageJson["version"]
         this.title = res.title || this.title
         this.titleService.setTitle(res.windowTitle || this.title)
         this.configService.setConf(res)

src/app/app.module.ts

@@ -2,7 +2,7 @@ import { BrowserModule } from '@angular/platform-browser'
 import { BrowserAnimationsModule } from '@angular/platform-browser/animations'
 import { NgModule, LOCALE_ID } from '@angular/core'
 import { FormsModule } from '@angular/forms'
-import { HttpClientModule } from '@angular/common/http'
+import { provideHttpClient, withInterceptorsFromDi } from '@angular/common/http'
 
 import { MatButtonModule } from '@angular/material/button'
 import { MatIconModule } from '@angular/material/icon'
@@ -32,34 +32,26 @@ import { HtmlSnackbarComponent } from './custom-snackbar/custom-snackbar.compone
 
 import { AppRoutingModule } from './app-routing.module'
 
-@NgModule({
+@NgModule({ declarations: [
-    declarations: [
         AppComponent,
         PageNotFoundComponent,
         HtmlSnackbarComponent,
     ],
-    imports: [
+    bootstrap: [
+        AppComponent
+    ], imports: [
         // ApolloModule,
-
         BrowserModule,
         BrowserAnimationsModule,
-
         FormsModule,
-        HttpClientModule,
-
         MatToolbarModule,
         MatButtonModule,
         MatIconModule,
         MatSnackBarModule,
-
         MatTooltipModule,
-
         FlexLayoutModule,
-
         AppRoutingModule,
-        LoginModule,
+        LoginModule], providers: [
-    ],
-    providers: [
         ActionsService,
         AuthenticationService,
         BootstrapService,
@@ -75,9 +67,6 @@ import { AppRoutingModule } from './app-routing.module'
             provide: LOCALE_ID,
             useValue: "en-IN"
         },
-    ],
+        provideHttpClient(withInterceptorsFromDi()),
-    bootstrap: [
+    ] })
-        AppComponent
-    ]
-})
 export class AppModule {}

src/app/info/info-home/info-home.component.ts

@@ -4,6 +4,5 @@ import { Component } from '@angular/core'
 @Component({
   selector: 'gisaf-info-home',
   templateUrl: './info-home.component.html',
-    styleUrls: ['./info-home.component.css']
 })
 export class InfoHomeComponent { }

src/app/info/info-tags/tag-action.component.ts

@@ -1,5 +1,7 @@
-import { Component, Input,
+import {
-    ChangeDetectionStrategy, ChangeDetectorRef } from '@angular/core'
+  Component, Input,
+  ChangeDetectionStrategy, ChangeDetectorRef
+} from '@angular/core'
 
 import { Tag } from './tags.service'
 import { FullInfo, InfoDataService, FormField } from '../info-data.service'
@@ -12,7 +14,6 @@ import { MapControlService } from '../../map/map-control.service'
 @Component({
   selector: 'gisaf-tag-action',
   templateUrl: './tag-action.component.html',
-    styleUrls: ['./tag-action.component.css'],
   changeDetection: ChangeDetectionStrategy.OnPush,
 })
 export class TagActionComponent {

src/app/info/info-tools/downloader.component.ts

@@ -8,7 +8,6 @@ import { Downloader } from '../../openapi'
 @Component({
   selector: 'gisaf-downloader',
   templateUrl: './downloader.component.html',
-    styleUrls: ['./downloader.component.css']
 })
 export class DownloaderComponent implements OnInit {
   @Input() source: FullInfo

src/app/map/gisaf-mapbox/gisaf-mapbox.component.ts

@@ -1,5 +1,7 @@
-import { Component, OnInit, OnDestroy, Input, ViewChild, NgZone,
+import {
-    ChangeDetectionStrategy, ChangeDetectorRef, ElementRef } from '@angular/core'
+  Component, OnInit, OnDestroy, Input, ViewChild, NgZone,
+  ChangeDetectionStrategy, ChangeDetectorRef, ElementRef
+} from '@angular/core'
 import { ActivatedRoute, Params, Router } from '@angular/router'
 
 import { Observable } from 'rxjs'
@@ -8,9 +10,11 @@ import { WebSocketSubject } from 'rxjs/webSocket'
 
 import { MatSnackBar } from '@angular/material/snack-bar'
 
-import { Map, MapMouseEvent, LayerSpecification,
+import {
+  Map, MapMouseEvent, LayerSpecification,
   GeoJSONSourceSpecification, FitBoundsOptions,
-    ExpressionSpecification, Source, GeoJSONSource } from 'maplibre-gl'
+  ExpressionSpecification, Source, GeoJSONSource
+} from 'maplibre-gl'
 import Point from '@mapbox/point-geometry'
 
 import * as bbox from '@turf/bbox'
@@ -193,9 +197,18 @@ export class GisafMapboxComponent implements OnInit, OnDestroy {
   }
 
   _getNewSingleOpacity(layerId: string, originalOpacity: number | object): number | object {
-        if (typeof(originalOpacity) === 'number') {
+    if (originalOpacity === undefined) {
+      return undefined
+    }
+    else if (typeof originalOpacity === 'number') {
       return originalOpacity * this._baseStyleOpacity
     }
+    else if (typeof originalOpacity === 'object') {  // Also matches array
+      if (originalOpacity[0] == 'interpolate') {
+        // Change the last interpolation point
+        originalOpacity[Object.values(originalOpacity).length - 1] = this._baseStyleOpacity
+        return originalOpacity
+      }
       else {
         let newOpacity = {}
         for (const k in originalOpacity) {
@@ -210,30 +223,40 @@ export class GisafMapboxComponent implements OnInit, OnDestroy {
         return newOpacity
       }
     }
+    else {
+      console.log(`Cannot process opacity of layer ${layerId}, unknown type ${typeof originalOpacity}`)
+      return originalOpacity
+    }
+  }
 
   _getNewOpacity(layer: object): object {
     let originalStyle = this.originalBaseStyle.style['layers'].find(
       (_layer: object) => layer['id'] == _layer['id']
     )
-        if (!('paint' in originalStyle)) {
+    let originalPaint = originalStyle['paint'] || {}
-            originalStyle['paint'] = {}
+    if (layer['type'] == 'symbol') {
-        }
-        if (['raster', 'background', 'fill', 'line'].indexOf(layer['type']) != -1) {
-            let prop = layer['type'] + '-opacity'
-            return {
-                [prop]: this._getNewSingleOpacity(layer['id'], originalStyle['paint'][prop] || 1.0)
-            }
-        }
-        else {
       let prop1 = 'text-opacity'
       let prop2 = 'icon-opacity'
-            let newOpacity1 = this._getNewSingleOpacity(layer['id'], originalStyle['paint'][prop1] || 1.0)
+      let newOpacity1 = this._getNewSingleOpacity(layer['id'], originalPaint[prop1] || 1.0)
-            let newOpacity2 = this._getNewSingleOpacity(layer['id'], originalStyle['paint'][prop2] || 1.0)
+      let newOpacity2 = this._getNewSingleOpacity(layer['id'], originalPaint[prop2] || 1.0)
       return {
         [prop1]: newOpacity1,
         [prop2]: newOpacity2,
       }
     }
+    else if (layer['type'] == 'line') {
+      let prop = layer['type'] + '-opacity'
+      return {
+        [prop]: this._getNewSingleOpacity(layer['id'], originalPaint[prop] || 1.0)
+      }
+    }
+    else {
+      // layer['type'] in ['raster', 'background', 'fill', 'line', 'fill-extrusion']
+      let prop = layer['type'] + '-opacity'
+      return {
+        [prop]: this._getNewSingleOpacity(layer['id'], originalPaint[prop] || 1.0),
+      }
+    }
   }
 
   applyBaseStyleOpacity() {
@@ -243,10 +266,12 @@ export class GisafMapboxComponent implements OnInit, OnDestroy {
         continue
       }
       for (const [key, value] of Object.entries(this._getNewOpacity(bsLayer))) {
+        if (value !== undefined) {
           this.map.setPaintProperty(bsLayer.id, key, value)
         }
       }
     }
+  }
 
   /*
    * For reference:

src/app/map/gisaf-mapbox/gisaf-ruler.directive.ts

@@ -1,6 +1,4 @@
-import { ElementRef, Input, ViewChild, Directive, HostListener } from '@angular/core'
+import { ElementRef, Input, ViewChild, Directive, HostListener, OutputRefSubscription } from '@angular/core'
-
-import { Subscription } from 'rxjs'
 
 import { MatButton } from '@angular/material/button'
 
@@ -41,7 +39,7 @@ export class GisafRulerDirective {
   @Input() secondaryColor: string = 'white'
   @Input() fontHalo: number = 2
   @ViewChild(MatButton) button: MatButton
-  clickSubscription: Subscription
+  clickSubscription: OutputRefSubscription
   lineDrawn: boolean
 
   constructor(

src/app/map/map-data.service.ts

@@ -90,7 +90,7 @@ export class MapDataService {
 
   getBaseStyle(styleName: string): Observable<BaseStyle> {
     return this.mapService.getBaseStyleApiMapBaseStyleNameGet({ name: styleName }).pipe(map(
-            data => new BaseStyle(data.name, <any>data.style)
+      (data: OApiBaseStyle) => new BaseStyle(data.name, <any>data.style)
     ))
   }
 

src/app/openapi/core/OpenAPI.ts

@@ -47,7 +47,7 @@ export const OpenAPI: OpenAPIConfig = {
 	PASSWORD: undefined,
 	TOKEN: undefined,
 	USERNAME: undefined,
-	VERSION: '0.1.dev85+g41e92fa.d20240509',
+	VERSION: '0.6.0a0',
 	WITH_CREDENTIALS: false,
 	interceptors: {
 		response: new Interceptors(),

src/app/openapi/schemas.gen.ts

@@ -259,12 +259,26 @@ export const $BaseStyle = {
             title: 'Style'
         },
         mbtiles: {
-            type: 'string',
+            anyOf: [
+                {
+                    type: 'string'
+                },
+                {
+                    type: 'null'
+                }
+            ],
             title: 'Mbtiles'
         },
-        static_tiles_url: {
+        static_url: {
-            type: 'string',
+            anyOf: [
-            title: 'Static Tiles Url'
+                {
+                    type: 'string'
+                },
+                {
+                    type: 'null'
+                }
+            ],
+            title: 'Static Url'
         },
         enabled: {
             type: 'boolean',
@@ -273,7 +287,7 @@ export const $BaseStyle = {
         }
     },
     type: 'object',
-    required: ['name', 'style', 'mbtiles', 'static_tiles_url'],
+    required: ['name'],
     title: 'BaseStyle'
 } as const;
 
@@ -311,7 +325,6 @@ export const $BasketDefault = {
             title: 'Store'
         }
     },
-    additionalProperties: false,
     type: 'object',
     title: 'BasketDefault'
 } as const;
@@ -514,52 +527,43 @@ export const $BootstrapData = {
         version: {
             type: 'string',
             title: 'Version',
-            default: '0.1.dev85+g41e92fa.d20240509'
+            default: '0.6.0a0'
         },
         title: {
             type: 'string',
             title: 'Title',
-            default: 'Auroville Geomatics Studio (Me)'
+            default: 'Gisaf'
         },
         windowTitle: {
             type: 'string',
             title: 'Windowtitle',
-            default: 'AV Geomatics Studio (Me)'
+            default: 'Gisaf'
         },
         map: {
-            allOf: [
+            '$ref': '#/components/schemas/Map',
-                {
-                    '$ref': '#/components/schemas/Map'
-                }
-            ],
             default: {
-                attribution: '© Auroville CSR Geomatics',
-                bearing: 0,
-                defaultStatus: ['E'],
-                lat: 12.007,
-                lng: 79.8098,
-                opacity: 0.4,
-                pitch: 0,
-                status: ['E', 'F', 'D'],
-                style: 'No base map',
-                tagKeys: ['source'],
                 tileServer: {
-                    baseDir: '/home/phil/gisaf_misc/map',
+                    baseDir: '/home/phil/.local/share/gisaf/mbtiles_files_dir',
-                    openMapTilesKey: 'cS3lrAfYXoM4MDooT6aS',
+                    spriteBaseDir: '/home/phil/.local/share/gisaf/mbtiles_sprites_dir',
-                    spriteBaseDir: '/home/phil/gisaf_misc/map/sprite',
+                    spriteBaseUrl: 'https://gisaf.example.org',
-                    spriteBaseUrl: 'https://gis.auroville.org.in',
                     spriteUrl: '/tiles/sprite/sprite',
-                    useRequestUrl: true
+                    useRequestUrl: false
                 },
-                zoom: 14
+                zoom: 14,
+                pitch: 45,
+                lat: 12,
+                lng: 79.8106,
+                bearing: 0,
+                style: 'OpenFreeMap',
+                opacity: 1,
+                attribution: '',
+                status: ['E', 'F', 'D'],
+                defaultStatus: ['E'],
+                tagKeys: ['source']
             }
         },
         geo: {
-            allOf: [
+            '$ref': '#/components/schemas/Geo',
-                {
-                    '$ref': '#/components/schemas/Geo'
-                }
-            ],
             default: {
                 raw_survey: {
                     spatial_sys_ref: {
@@ -584,19 +588,13 @@ export const $BootstrapData = {
             }
         },
         measures: {
-            allOf: [
+            '$ref': '#/components/schemas/Measures',
-                {
+            default: {}
-                    '$ref': '#/components/schemas/Measures'
-                }
-            ],
-            default: {
-                defaultStore: 'avsm_water.well'
-            }
         },
         redirect: {
             type: 'string',
             title: 'Redirect',
-            default: 'http://gis.auroville.org.in'
+            default: ''
         },
         user: {
             anyOf: [
@@ -1442,11 +1440,7 @@ export const $FormFieldInput = {
 export const $Geo = {
     properties: {
         raw_survey: {
-            allOf: [
+            '$ref': '#/components/schemas/RawSurvey',
-                {
-                    '$ref': '#/components/schemas/RawSurvey'
-                }
-            ],
             default: {
                 spatial_sys_ref: {
                     author: 'AVSM',
@@ -1485,7 +1479,6 @@ export const $Geo = {
             default: 32644
         }
     },
-    additionalProperties: false,
     type: 'object',
     title: 'Geo'
 } as const;
@@ -1568,17 +1561,13 @@ export const $LegendItem = {
 export const $Map = {
     properties: {
         tileServer: {
-            allOf: [
+            '$ref': '#/components/schemas/TileServer',
-                {
-                    '$ref': '#/components/schemas/TileServer'
-                }
-            ],
             default: {
-                baseDir: '/path/to/mbtiles_files_dir',
+                baseDir: '/home/phil/.local/share/gisaf/mbtiles_files_dir',
-                spriteBaseDir: '/path/to/mbtiles_sprites_dir',
+                useRequestUrl: false,
-                spriteBaseUrl: 'https://gisaf.example.org',
+                spriteBaseDir: '/home/phil/.local/share/gisaf/mbtiles_sprites_dir',
                 spriteUrl: '/tiles/sprite/sprite',
-                useRequestUrl: false
+                spriteBaseUrl: 'https://gisaf.example.org'
             }
         },
         zoom: {
@@ -1609,7 +1598,7 @@ export const $Map = {
         style: {
             type: 'string',
             title: 'Style',
-            default: 'OSM (vector)'
+            default: 'OpenFreeMap'
         },
         opacity: {
             type: 'number',
@@ -1646,7 +1635,6 @@ export const $Map = {
             default: ['source']
         }
     },
-    additionalProperties: false,
     type: 'object',
     title: 'Map'
 } as const;
@@ -1790,7 +1778,6 @@ export const $Measures = {
             title: 'Defaultstore'
         }
     },
-    additionalProperties: false,
     type: 'object',
     title: 'Measures'
 } as const;
@@ -2109,11 +2096,7 @@ export const $Project = {
 export const $RawSurvey = {
     properties: {
         spatial_sys_ref: {
-            allOf: [
+            '$ref': '#/components/schemas/SpatialSysRef',
-                {
-                    '$ref': '#/components/schemas/SpatialSysRef'
-                }
-            ],
             default: {
                 author: 'AVSM',
                 ellps: 'WGS84',
@@ -2134,7 +2117,6 @@ export const $RawSurvey = {
             default: 910001
         }
     },
-    additionalProperties: false,
     type: 'object',
     title: 'RawSurvey'
 } as const;
@@ -2237,7 +2219,6 @@ export const $SpatialSysRef = {
             default: 1328608.994
         }
     },
-    additionalProperties: false,
     type: 'object',
     title: 'SpatialSysRef'
 } as const;
@@ -2386,11 +2367,12 @@ export const $Store = {
         },
         z_index: {
             type: 'integer',
-            title: 'Z Index'
+            title: 'Z Index',
+            default: 500
         }
     },
     type: 'object',
-    required: ['name', 'auto_import', 'custom', 'description', 'gis_type', 'group', 'in_menu', 'is_db', 'is_line_work', 'is_live', 'long_name', 'type', 'minor_group_1', 'minor_group_2', 'status', 'style', 'symbol', 'title', 'viewable_role', 'z_index'],
+    required: ['name', 'auto_import', 'custom', 'description', 'gis_type', 'group', 'in_menu', 'is_db', 'is_line_work', 'is_live', 'long_name', 'type', 'minor_group_1', 'minor_group_2', 'status', 'style', 'symbol', 'title'],
     title: 'Store'
 } as const;
 
@@ -2648,8 +2630,9 @@ export const $TileServer = {
     properties: {
         baseDir: {
             type: 'string',
+            format: 'path',
             title: 'Basedir',
-            default: '/path/to/mbtiles_files_dir'
+            default: '/home/phil/.local/share/gisaf/mbtiles_files_dir'
         },
         useRequestUrl: {
             type: 'boolean',
@@ -2658,8 +2641,9 @@ export const $TileServer = {
         },
         spriteBaseDir: {
             type: 'string',
+            format: 'path',
             title: 'Spritebasedir',
-            default: '/path/to/mbtiles_sprites_dir'
+            default: '/home/phil/.local/share/gisaf/mbtiles_sprites_dir'
         },
         spriteUrl: {
             type: 'string',
@@ -2683,7 +2667,6 @@ export const $TileServer = {
             title: 'Openmaptileskey'
         }
     },
-    additionalProperties: false,
     type: 'object',
     title: 'TileServer'
 } as const;

src/app/openapi/types.gen.ts

@@ -54,11 +54,11 @@ export type BaseMapWithStores = {
 export type BaseStyle = {
     id?: number | null;
     name: string;
-    style: {
+    style?: {
     [key: string]: unknown;
 } | null;
-    mbtiles: string;
+    mbtiles?: string | null;
-    static_tiles_url: string;
+    static_url?: string | null;
     enabled?: boolean;
 };
 
@@ -457,8 +457,8 @@ export type Store = {
     style: string | null;
     symbol: string | null;
     title: string;
-    viewable_role: string | null;
+    viewable_role?: string | null;
-    z_index: number;
+    z_index?: number;
 };
 
 export type StoreNameOnly = {
@@ -751,9 +751,7 @@ export type $OpenApiTs = {
     };
     '/api/token': {
         post: {
-            req: {
+            req: LoginForAccessTokenApiTokenPostData;
-                formData: Body_login_for_access_token_api_token_post;
-            };
             res: {
                 /**
                  * Successful Response
@@ -870,9 +868,7 @@ export type $OpenApiTs = {
     };
     '/api/data-provider/{store}': {
         get: {
-            req: {
+            req: GetModelListApiDataProviderStoreGetData;
-                store: string;
-            };
             res: {
                 /**
                  * Successful Response
@@ -891,12 +887,7 @@ export type $OpenApiTs = {
     };
     '/api/{store_name}/values/{value}': {
         get: {
-            req: {
+            req: GetModelValuesApiStoreNameValuesValueGetData;
-                resample?: string | null;
-                storeName: string;
-                value: string;
-                where: string;
-            };
             res: {
                 /**
                  * Successful Response
@@ -957,10 +948,7 @@ export type $OpenApiTs = {
     };
     '/api/feature-info/{store}/{id}': {
         get: {
-            req: {
+            req: GetFeatureInfoApiFeatureInfoStoreIdGetData;
-                id: string;
-                store: string;
-            };
             res: {
                 /**
                  * Successful Response
@@ -979,9 +967,7 @@ export type $OpenApiTs = {
     };
     '/api/model-info/{store}': {
         get: {
-            req: {
+            req: GetModelInfoApiModelInfoStoreGetData;
-                store: string;
-            };
             res: {
                 /**
                  * Successful Response
@@ -1000,11 +986,7 @@ export type $OpenApiTs = {
     };
     '/api/plot-params/{store}': {
         get: {
-            req: {
+            req: GetPlotParamsApiPlotParamsStoreGetData;
-                id: string;
-                store: string;
-                value: string;
-            };
             res: {
                 /**
                  * Successful Response
@@ -1037,9 +1019,7 @@ export type $OpenApiTs = {
     };
     '/api/execTagActions': {
         post: {
-            req: {
+            req: ExecuteTagActionApiExecTagActionsPostData;
-                requestBody: Body_execute_tag_action_api_execTagActions_post;
-            };
             res: {
                 /**
                  * Successful Response
@@ -1058,12 +1038,7 @@ export type $OpenApiTs = {
     };
     '/api/gj/{store_name}': {
         get: {
-            req: {
+            req: GetGeojsonApiGjStoreNameGetData;
-                ifNoneMatch?: string | null;
-                preserveTopology?: boolean | null;
-                simplify?: number | null;
-                storeName: unknown;
-            };
             res: {
                 /**
                  * Successful Response
@@ -1096,9 +1071,7 @@ export type $OpenApiTs = {
     };
     '/api/admin/basket/{name}': {
         get: {
-            req: {
+            req: GetBasketApiAdminBasketNameGetData;
-                name: string;
-            };
             res: {
                 /**
                  * Successful Response
@@ -1117,14 +1090,7 @@ export type $OpenApiTs = {
     };
     '/api/admin/basket/upload/{name}': {
         post: {
-            req: {
+            req: UploadBasketFileApiAdminBasketUploadNamePostData;
-                autoImport?: boolean;
-                equipmentId?: number | null;
-                formData: Body_upload_basket_file_api_admin_basket_upload__name__post;
-                name: string;
-                projectId?: number | null;
-                surveyorId?: number | null;
-            };
             res: {
                 /**
                  * Successful Response
@@ -1143,11 +1109,7 @@ export type $OpenApiTs = {
     };
     '/api/admin/basket/download/{name}/{file_id}/{file_name}': {
         get: {
-            req: {
+            req: DownloadBasketFileApiAdminBasketDownloadNameFileIdFileNameGetData;
-                fileId: number;
-                fileName: string;
-                name: string;
-            };
             res: {
                 /**
                  * Successful Response
@@ -1166,11 +1128,7 @@ export type $OpenApiTs = {
     };
     '/api/admin/basket/import/{basket}/{file_id}': {
         get: {
-            req: {
+            req: ImportBasketFileApiAdminBasketImportBasketFileIdGetData;
-                basket: string;
-                dryRun?: boolean;
-                fileId: number;
-            };
             res: {
                 /**
                  * Successful Response
@@ -1189,10 +1147,7 @@ export type $OpenApiTs = {
     };
     '/api/admin/basket/delete/{basket}/{file_id}': {
         get: {
-            req: {
+            req: DeleteBasketFileApiAdminBasketDeleteBasketFileIdGetData;
-                basket: string;
-                fileId: number;
-            };
             res: {
                 /**
                  * Successful Response
@@ -1239,10 +1194,7 @@ export type $OpenApiTs = {
     };
     '/api/dashboard/page/{group}/{name}': {
         get: {
-            req: {
+            req: GetDashboardPageApiDashboardPageGroupNameGetData;
-                group: string;
-                name: string;
-            };
             res: {
                 /**
                  * Successful Response
@@ -1271,9 +1223,7 @@ export type $OpenApiTs = {
     };
     '/api/map/base_style/{name}': {
         get: {
-            req: {
+            req: GetBaseStyleApiMapBaseStyleNameGetData;
-                name: string;
-            };
             res: {
                 /**
                  * Successful Response
@@ -1288,9 +1238,7 @@ export type $OpenApiTs = {
     };
     '/api/map/layer_style/{store}': {
         get: {
-            req: {
+            req: GetLayerStyleApiMapLayerStyleStoreGetData;
-                store: string;
-            };
             res: {
                 /**
                  * Successful Response
@@ -1305,12 +1253,7 @@ export type $OpenApiTs = {
     };
     '/api/download/csv/{store}/{model_id}/{value}/{resample}': {
         get: {
-            req: {
+            req: DownloadCsvApiDownloadCsvStoreModelIdValueResampleGetData;
-                modelId: number;
-                resample: string;
-                store: string;
-                value: string;
-            };
             res: {
                 /**
                  * Successful Response
@@ -1329,11 +1272,7 @@ export type $OpenApiTs = {
     };
     '/api/download/geodata/{stores}': {
         get: {
-            req: {
+            req: DownloadGeodataApiDownloadGeodataStoresGetData;
-                format?: string;
-                reproject?: boolean;
-                stores: string;
-            };
             res: {
                 /**
                  * Successful Response
@@ -1352,11 +1291,7 @@ export type $OpenApiTs = {
     };
     '/api/download/plugin/{name}/{store}/{id}': {
         get: {
-            req: {
+            req: ExecuteActionApiDownloadPluginNameStoreIdGetData;
-                id: number;
-                name: string;
-                store: string;
-            };
             res: {
                 /**
                  * Successful Response

tsconfig.json

@@ -1,24 +1,25 @@
 {
   "compileOnSave": false,
   "compilerOptions": {
-    "importHelpers": true,
-    "module": "es2020",
-    "outDir": "./dist/out-tsc",
-    "sourceMap": true,
     "declaration": false,
-    "moduleResolution": "node",
+    "esModuleInterop": true,
     "experimentalDecorators": true,
-    "target": "ES2022",
+    "importHelpers": true,
-    "typeRoots": [
-      "node_modules/@types",
-      "@types"
-    ],
     "lib": [
       "es2019",
       "dom",
       "esnext.asynciterable"
     ],
-    "allowSyntheticDefaultImports": true,
+    "module": "es2020",
+    "moduleResolution": "node",
+    "resolveJsonModule": true,
+    "outDir": "./dist/out-tsc",
+    "sourceMap": true,
+    "target": "ES2022",
+    "typeRoots": [
+      "node_modules/@types",
+      "@types"
+    ],
     "useDefineForClassFields": false
   },
   "angularCompilerOptions": {