Feature/iot 1615 update packages

.github/ISSUE_TEMPLATE/fejl----bug-report.md

@@ -11,32 +11,41 @@ assignees: ''
 [Indmeld kun 1 fejl pr. issue og tjek gerne om fejlen allerede er indmeldt //Only one bug per issue and make sure to check if the issue already exists.]
 
 ### Beskriv fejlen // Describe the bug
+
 Vær klar og præcis i din beskrivelse af fejlen // A clear and concise description of what the bug is.
 
 ### Genskab fejlen // To Reproduce
+
 Sådan genskabes fejlen // Steps to reproduce the behavior:
+
 1. Go to '...'
 2. Click on '....'
 3. Scroll down to '....'
 4. See error
 
 ### Forventet funktion // Expected behavior
+
 Beskriv klart og præcist hvordan du forventede, at det fungerede // A clear and concise description of what you expected to happen.
 
 ### Screenshots
+
 Tilføj om muligt et eller flere billeder, der viser fejlen // If applicable, add screenshots to help explain your problem.
 
 ### URL
+
 Angiv den URL, som fejlen opstår på - fx "../gateways/gateway-detail/60c5a8fffe7611a9" // Enter the URL at which the bug occurs - eg "../gateways/gateway-detail/60c5a8fffe7611a9".
 
 ### Desktop
+
 Udfyld venligst følgende // Please complete the following information:
-    Styresystem/OS: [e.g. WIN10]
-    Browser: [e.g. Chrome, Safari]
-    Version: [e.g. 22]
+Styresystem/OS: [e.g. WIN10]
+Browser: [e.g. Chrome, Safari]
+Version: [e.g. 22]
 
 ### Log
+
 Tilføj om muligt relevant log med fejlbeskrivelser // If applicable, add relevant log with error descriptions.
 
 ### Supplerende oplysninger (Additional context)
+
 Tilføj andre detaljer vedrørende fejlen // Add any other context about the problem here.

.github/ISSUE_TEMPLATE/ny-feature----feature-request.md

@@ -11,13 +11,17 @@ assignees: ''
 [Brug dette issue til at ønske tilføjelse af ny funktionalitet eller andet, der ikke allerede findes i OS2iot. Opret et issue pr. nyt ønske // Use this issue to request new functionality or other that doesn't already exist in OS2iot. Please only submit one request per issue.]
 
 ### Skyldes dit forslag et særligt behov eller et problem? Beskriv venligst // Is your feature request related to a certain need or problem? Please describe
+
 Beskriv problemet klart og præcist. Fx jeg har ofte brug for, at kunne... // A clear and concise description of what the need or problem is. Ex. I often need to be able to...
 
 ### Beskriv det du gerne ser tilføjet til OS2iot // Describe the solution you'd like to add to OS2iot
+
 Giv en præcis beskrivelse af, hvad der skal tilføjes // A clear and concise description of what you want to add to the design system.
 
 ### Beskriv de alternativer du har overvejet // Describe alternatives you've considered
+
 Giv en kort og præcis beskrivelse af alle de alternativer du har overvejet og hvorfor du foreslår den løsning du gør // A clear and concise description of any alternative solutions or features you've considered, and why you've settled on that solution.
 
 ### Supplerende bemærkninger // Additional context
+
 Tilføj yderligere beskrivelser og billeder her, der forklarer dit forslag // Add any other context or screenshots about the feature request here.

.github/workflows/on-push-pr.action.yml

@@ -29,7 +29,7 @@ jobs:
       - uses: actions/setup-node@v3
         name: Set NodeJS version
         with:
-          node-version: 18
+          node-version: 20
       - name: Install packages
         run: "npm ci"
       - name: Build source

.vscode/launch.json

@@ -1,6 +1,7 @@
 {
   "version": "0.2.0",
-  "configurations": [{
+  "configurations": [
+    {
       "type": "firefox",
       "request": "launch",
       "reAttach": true,
@@ -14,6 +15,6 @@
       "request": "launch",
       "url": "http://localhost:4200",
       "webRoot": "${workspaceFolder}"
-    },
+    }
   ]
 }

.vscode/settings.json

@@ -1,3 +1,3 @@
 {
-    "typescript.tsdk": "node_modules\\typescript\\lib"
+  "typescript.tsdk": "node_modules\\typescript\\lib"
 }

Dockerfile

@@ -1,6 +1,6 @@
 # Based on https://mherman.org/blog/dockerizing-an-angular-app/
 # base image
-FROM node:18-alpine as DEV
+FROM node:20-alpine as DEV
 
 # removed this for now
 # install chrome for protractor tests
@@ -17,7 +17,7 @@ ENV PATH /app/node_modules/.bin:$PATH
 # install and cache app dependencies
 COPY package.json /app/package.json
 RUN npm install
-RUN npm install -g @angular/cli@17.3.8
+RUN npm install -g @angular/cli@20.3.7
 
 # add app
 COPY . /app

Dockerfile-prod

@@ -1,6 +1,6 @@
 # Based on https://mherman.org/blog/dockerizing-an-angular-app/
 # base image
-FROM node:18-alpine as builder
+FROM node:20-alpine as builder
 
 # removed this for now
 # install chrome for protractor tests
@@ -17,7 +17,7 @@ ENV PATH /app/node_modules/.bin:$PATH
 # install and cache app dependencies
 COPY package.json /app/package.json
 RUN npm install
-RUN npm install -g @angular/cli@17.3.8
+RUN npm install -g @angular/cli@20.3.7
 
 # add app
 COPY . /app

angular.json

@@ -15,33 +15,44 @@
       "prefix": "app",
       "architect": {
         "build": {
-          "builder": "@angular-devkit/build-angular:browser",
+          "builder": "@angular-devkit/build-angular:application",
           "options": {
-            "outputPath": "dist/OS2IoT-frontend",
+            "outputPath": {
+              "base": "dist/OS2IoT-frontend"
+            },
             "index": "src/index.html",
-            "main": "src/main.ts",
-            "polyfills": "src/polyfills.ts",
+            "polyfills": [
+              "src/polyfills.ts"
+            ],
             "tsConfig": "tsconfig.app.json",
             "assets": [
               "src/favicon.ico",
               "src/assets",
-              { "glob": "**/*", "input": "node_modules/monaco-editor", "output": "/assets/monaco/" }
+              {
+                "glob": "**/*",
+                "input": "node_modules/monaco-editor",
+                "output": "/assets/monaco/"
+              }
             ],
             "styles": [
               "./node_modules/animate.css/animate.min.css",
               "./node_modules/@angular/material/prebuilt-themes/indigo-pink.css",
               "src/styles.scss"
             ],
             "scripts": [
-              "node_modules/popper.js/dist/umd/popper.min.js",
+              "node_modules/@popperjs/core/dist/umd/popper.min.js",
               "node_modules/bootstrap/dist/js/bootstrap.min.js"
             ],
-            "vendorChunk": true,
             "extractLicenses": false,
-            "buildOptimizer": false,
             "sourceMap": true,
             "optimization": false,
-            "namedChunks": true
+            "namedChunks": true,
+            "browser": "src/main.ts",
+            "stylePreprocessorOptions": {
+              "includePaths": [
+                "."
+              ]
+            }
           },
           "configurations": {
             "production": {
@@ -50,8 +61,6 @@
               "sourceMap": false,
               "namedChunks": false,
               "extractLicenses": true,
-              "vendorChunk": false,
-              "buildOptimizer": true,
               "budgets": [
                 {
                   "type": "initial",
@@ -92,8 +101,13 @@
             "polyfills": "src/polyfills.ts",
             "tsConfig": "tsconfig.spec.json",
             "karmaConfig": "karma.conf.js",
-            "assets": ["src/favicon.ico", "src/assets"],
-            "styles": ["src/styles.scss"],
+            "assets": [
+              "src/favicon.ico",
+              "src/assets"
+            ],
+            "styles": [
+              "src/styles.scss"
+            ],
             "scripts": []
           }
         },
@@ -114,5 +128,31 @@
   },
   "cli": {
     "analytics": "5e34252a-5088-421b-bb34-6ef89cd9f167"
+  },
+  "schematics": {
+    "@schematics/angular:component": {
+      "type": "component"
+    },
+    "@schematics/angular:directive": {
+      "type": "directive"
+    },
+    "@schematics/angular:service": {
+      "type": "service"
+    },
+    "@schematics/angular:guard": {
+      "typeSeparator": "."
+    },
+    "@schematics/angular:interceptor": {
+      "typeSeparator": "."
+    },
+    "@schematics/angular:module": {
+      "typeSeparator": "."
+    },
+    "@schematics/angular:pipe": {
+      "typeSeparator": "."
+    },
+    "@schematics/angular:resolver": {
+      "typeSeparator": "."
+    }
   }
 }

e2e/protractor.conf.js

@@ -2,33 +2,29 @@
 // Protractor configuration file, see link for more information
 // https://github.com/angular/protractor/blob/master/lib/config.ts
 
-const { SpecReporter } = require('jasmine-spec-reporter');
+const { SpecReporter } = require("jasmine-spec-reporter");
 
 /**
  * @type { import("protractor").Config }
  */
 exports.config = {
-    allScriptsTimeout: 11000,
-    specs: ['./src/**/*.e2e-spec.ts'],
-    capabilities: {
-        browserName: 'chrome',
-    },
-    directConnect: true,
-    baseUrl: 'http://localhost:4200/',
-    framework: 'jasmine',
-    jasmineNodeOpts: {
-        showColors: true,
-        defaultTimeoutInterval: 30000,
-        print: function () {},
-    },
-    onPrepare() {
-        require('ts-node').register({
-            project: require('path').join(__dirname, './tsconfig.json'),
-        });
-        jasmine
-            .getEnv()
-            .addReporter(
-                new SpecReporter({ spec: { displayStacktrace: true } })
-            );
-    },
+  allScriptsTimeout: 11000,
+  specs: ["./src/**/*.e2e-spec.ts"],
+  capabilities: {
+    browserName: "chrome",
+  },
+  directConnect: true,
+  baseUrl: "http://localhost:4200/",
+  framework: "jasmine",
+  jasmineNodeOpts: {
+    showColors: true,
+    defaultTimeoutInterval: 30000,
+    print: function () {},
+  },
+  onPrepare() {
+    require("ts-node").register({
+      project: require("path").join(__dirname, "./tsconfig.json"),
+    });
+    jasmine.getEnv().addReporter(new SpecReporter({ spec: { displayStacktrace: true } }));
+  },
 };

e2e/src/app.e2e-spec.ts

@@ -1,25 +1,25 @@
-import { AppPage } from './app.po';
-import { browser, logging } from 'protractor';
+import { AppPage } from "./app.po";
+import { browser, logging } from "protractor";
 
-describe('workspace-project App', () => {
-    let page: AppPage;
+describe("workspace-project App", () => {
+  let page: AppPage;
 
-    beforeEach(() => {
-        page = new AppPage();
-    });
+  beforeEach(() => {
+    page = new AppPage();
+  });
 
-    it('should display welcome message', () => {
-        page.navigateTo();
-        expect(page.getTitleText()).toEqual('OS2IoT-frontend app is running!');
-    });
+  it("should display welcome message", () => {
+    page.navigateTo();
+    expect(page.getTitleText()).toEqual("OS2IoT-frontend app is running!");
+  });
 
-    afterEach(async () => {
-        // Assert that there are no errors emitted from the browser
-        const logs = await browser.manage().logs().get(logging.Type.BROWSER);
-        expect(logs).not.toContain(
-            jasmine.objectContaining({
-                level: logging.Level.SEVERE,
-            } as logging.Entry)
-        );
-    });
+  afterEach(async () => {
+    // Assert that there are no errors emitted from the browser
+    const logs = await browser.manage().logs().get(logging.Type.BROWSER);
+    expect(logs).not.toContain(
+      jasmine.objectContaining({
+        level: logging.Level.SEVERE,
+      } as logging.Entry)
+    );
+  });
 });

e2e/src/app.po.ts

@@ -1,13 +1,11 @@
-import { browser, by, element } from 'protractor';
+import { browser, by, element } from "protractor";
 
 export class AppPage {
-    navigateTo(): Promise<unknown> {
-        return browser.get(browser.baseUrl) as Promise<unknown>;
-    }
+  navigateTo(): Promise<unknown> {
+    return browser.get(browser.baseUrl) as Promise<unknown>;
+  }
 
-    getTitleText(): Promise<string> {
-        return element(by.css('app-root .content span')).getText() as Promise<
-            string
-        >;
-    }
+  getTitleText(): Promise<string> {
+    return element(by.css("app-root .content span")).getText() as Promise<string>;
+  }
 }

e2e/tsconfig.json

@@ -1,9 +1,13 @@
 {
-    "extends": "../tsconfig.json",
-    "compilerOptions": {
-        "outDir": "../out-tsc/e2e",
-        "module": "commonjs",
-        "target": "es2018",
-        "types": ["jasmine", "jasminewd2", "node"]
-    }
+  "extends": "../tsconfig.json",
+  "compilerOptions": {
+    "outDir": "../out-tsc/e2e",
+    "module": "commonjs",
+    "target": "es2018",
+    "types": [
+      "jasmine",
+      "jasminewd2",
+      "node"
+    ]
+  }
 }