Update angular version

ui-ngx/e2e/tsconfig.e2e.json

@@ -1,5 +1,5 @@
 {
-  "extends": "../tsconfig.base.json",
+  "extends": "../tsconfig.json",
   "compilerOptions": {
     "outDir": "../out-tsc/app",
     "module": "commonjs",
@@ -10,4 +10,4 @@
       "node"
     ]
   }
-}
+}

ui-ngx/extra-webpack.config.js

@@ -32,7 +32,7 @@ module.exports = {
       SUPPORTED_LANGS: JSON.stringify(langs),
     }),
     new CompressionPlugin({
-      filename: "[path].gz[query]",
+      filename: "[path][base].gz[query]",
       algorithm: "gzip",
       test: /\.js$|\.css$|\.html$|\.svg?.+$|\.jpg$|\.ttf?.+$|\.woff?.+$|\.eot?.+$|\.json$/,
       threshold: 10240,

ui-ngx/package.json

@@ -12,33 +12,33 @@
   },
   "private": true,
   "dependencies": {
-    "@angular/animations": "^10.0.9",
+    "@angular/animations": "^10.1.5",
-    "@angular/cdk": "^10.1.3",
+    "@angular/cdk": "^10.2.4",
-    "@angular/common": "^10.0.9",
+    "@angular/common": "^10.1.5",
-    "@angular/compiler": "^10.0.9",
+    "@angular/compiler": "^10.1.5",
-    "@angular/core": "^10.0.9",
+    "@angular/core": "^10.1.5",
     "@angular/flex-layout": "^10.0.0-beta.32",
-    "@angular/forms": "^10.0.9",
+    "@angular/forms": "^10.1.5",
-    "@angular/material": "^10.1.3",
+    "@angular/material": "^10.2.4",
-    "@angular/platform-browser": "^10.0.9",
+    "@angular/platform-browser": "^10.1.5",
-    "@angular/platform-browser-dynamic": "^10.0.9",
+    "@angular/platform-browser-dynamic": "^10.1.5",
-    "@angular/router": "^10.0.9",
+    "@angular/router": "^10.1.5",
     "@auth0/angular-jwt": "^5.0.1",
     "@date-io/date-fns": "^2.6.1",
     "@flowjs/flow.js": "^2.14.1",
     "@flowjs/ngx-flow": "^0.4.4",
     "@juggle/resize-observer": "^3.1.3",
-    "@mat-datetimepicker/core": "^5.0.1",
+    "@mat-datetimepicker/core": "^5.1.0",
     "@material-ui/core": "^4.11.0",
     "@material-ui/icons": "^4.9.1",
     "@material-ui/pickers": "^3.2.10",
-    "@ngrx/effects": "^10.0.0",
+    "@ngrx/effects": "^10.0.1",
-    "@ngrx/store": "^10.0.0",
+    "@ngrx/store": "^10.0.1",
-    "@ngrx/store-devtools": "^10.0.0",
+    "@ngrx/store-devtools": "^10.0.1",
     "@ngx-translate/core": "^13.0.0",
     "@ngx-translate/http-loader": "^6.0.0",
     "ace-builds": "^1.4.12",
-    "angular-gridster2": "^10.1.3",
+    "angular-gridster2": "^10.1.6",
     "angular2-hotkeys": "^2.2.0",
     "canvas-gauges": "^2.1.7",
     "compass-sass-mixins": "^0.12.7",
@@ -48,8 +48,8 @@
     "flot.curvedlines": "git://github.com/MichaelZinsmaier/CurvedLines.git#master",
     "font-awesome": "^4.7.0",
     "jquery": "^3.5.1",
-    "jquery.terminal": "^2.16.0",
+    "jquery.terminal": "^2.18.3",
-    "js-beautify": "^1.12.0",
+    "js-beautify": "^1.13.0",
     "json-schema-defaults": "^0.4.0",
     "jstree": "^3.3.10",
     "jstree-bootstrap-theme": "^1.0.1",
@@ -62,62 +62,64 @@
     "leaflet.markercluster": "^1.4.1",
     "material-design-icons": "^3.0.1",
     "messageformat": "^2.3.0",
-    "moment": "^2.27.0",
+    "moment": "^2.29.1",
     "moment-timezone": "^0.5.31",
+    "mousetrap": "1.6.3",
     "ngx-clipboard": "^13.0.1",
-    "ngx-color-picker": "^10.0.1",
+    "ngx-color-picker": "^10.1.0",
     "ngx-daterangepicker-material": "^4.0.1",
     "ngx-flowchart": "git://github.com/thingsboard/ngx-flowchart.git#master",
     "ngx-hm-carousel": "^2.0.0-rc.1",
     "ngx-sharebuttons": "^8.0.1",
     "ngx-translate-messageformat-compiler": "^4.8.0",
     "objectpath": "^2.0.0",
-    "prettier": "^2.0.5",
+    "prettier": "^2.1.2",
     "prop-types": "^15.7.2",
     "raphael": "^2.3.0",
-    "rc-select": "^11.1.3",
+    "rc-select": "^11.3.3",
     "react": "^16.13.1",
-    "react-ace": "^9.1.3",
+    "react-ace": "^9.1.4",
     "react-dom": "^16.13.1",
-    "react-dropzone": "^11.0.3",
+    "react-dropzone": "^11.2.0",
     "reactcss": "^1.2.3",
-    "rxjs": "^6.6.2",
+    "rxjs": "^6.6.3",
     "schema-inspector": "^1.7.0",
     "screenfull": "^5.0.2",
     "split.js": "^1.6.2",
     "systemjs": "0.21.5",
-    "tinycolor2": "^1.4.1",
+    "tinycolor2": "^1.4.2",
     "tooltipster": "^4.2.8",
-    "tslib": "^2.0.1",
+    "tslib": "^2.0.2",
     "tv4": "^1.3.0",
-    "typeface-roboto": "^0.0.75",
+    "typeface-roboto": "^1.1.13",
-    "zone.js": "~0.10.3"
+    "zone.js": "~0.11.1"
   },
   "devDependencies": {
-    "@angular-builders/custom-webpack": "^10.0.0",
+    "@angular-builders/custom-webpack": "^10.0.1",
-    "@angular-devkit/build-angular": "^0.1000.5",
+    "@angular-devkit/build-angular": "^0.1001.5",
-    "@angular/cli": "^10.0.5",
+    "@angular/cli": "^10.1.5",
-    "@angular/compiler-cli": "^10.0.9",
+    "@angular/compiler-cli": "^10.1.5",
-    "@angular/language-service": "^10.0.9",
+    "@angular/language-service": "^10.1.5",
     "@types/canvas-gauges": "^2.1.2",
     "@types/flot": "^0.0.31",
     "@types/jasmine": "^3.5.12",
     "@types/jasminewd2": "^2.0.8",
-    "@types/jquery": "^3.5.1",
+    "@types/jquery": "^3.5.2",
     "@types/js-beautify": "^1.11.0",
     "@types/jstree": "^3.3.40",
     "@types/leaflet": "^1.5.17",
     "@types/leaflet-polylinedecorator": "^1.6.0",
-    "@types/leaflet.markercluster": "^1.4.2",
+    "@types/leaflet.markercluster": "^1.4.3",
-    "@types/lodash": "^4.14.159",
+    "@types/lodash": "^4.14.161",
     "@types/moment-timezone": "^0.5.30",
+    "@types/mousetrap": "1.6.3",
     "@types/raphael": "^2.3.0",
-    "@types/react": "^16.9.46",
+    "@types/react": "^16.9.51",
     "@types/react-dom": "^16.9.8",
     "@types/tinycolor2": "^1.4.2",
     "@types/tooltipster": "^0.0.30",
-    "codelyzer": "^6.0.0",
+    "codelyzer": "^6.0.1",
-    "compression-webpack-plugin": "^4.0.1",
+    "compression-webpack-plugin": "^6.0.2",
     "directory-tree": "^2.2.4",
     "jasmine-core": "~3.6.0",
     "jasmine-spec-reporter": "~5.0.2",
@@ -128,9 +130,9 @@
     "karma-jasmine-html-reporter": "^1.5.4",
     "ngrx-store-freeze": "^0.2.4",
     "protractor": "~7.0.0",
-    "ts-node": "^8.10.2",
+    "ts-node": "^9.0.0",
     "tslint": "~6.1.3",
-    "typescript": "~3.9.7",
+    "typescript": "~4.0.3",
-    "webpack": "^4.44.1"
+    "webpack": "^4.44.2"
   }
 }

ui-ngx/src/app/modules/home/home.component.ts

@@ -50,7 +50,7 @@ export class HomeComponent extends PageComponent implements AfterViewInit, OnIni
   sidenavMode: 'over' | 'push' | 'side' = 'side';
   sidenavOpened = true;
 
-  logo = require('../../../assets/logo_title_white.svg').default;
+  logo = 'assets/logo_title_white.svg';
 
   @ViewChild('sidenav')
   sidenav: MatSidenav;

ui-ngx/src/app/shared/components/json-form/react/json-form.scss

@@ -262,6 +262,10 @@ $previewSize: 100px !default;
     transform: translate(0%, -50%) !important;
   }
 
+  .MuiButton-root {
+    text-transform: none;
+  }
+
 }
 
 .rc-select {

ui-ngx/src/app/shared/components/logo.component.ts

@@ -23,7 +23,7 @@ import { Component } from '@angular/core';
 })
 export class LogoComponent {
 
-  logo = require('../../../assets/logo_title_white.svg').default;
+  logo = 'assets/logo_title_white.svg';
 
   gotoThingsboard(): void {
     window.open('https://thingsboard.io', '_blank');

ui-ngx/src/tsconfig.app.json

@@ -1,5 +1,5 @@
 {
-  "extends": "../tsconfig.base.json",
+  "extends": "../tsconfig.json",
   "compilerOptions": {
     "outDir": "../out-tsc/app",
     "types": ["node", "jquery", "flot", "tooltipster", "tinycolor2", "js-beautify",

ui-ngx/src/tsconfig.spec.json

@@ -1,5 +1,5 @@
 {
-  "extends": "../tsconfig.base.json",
+  "extends": "../tsconfig.json",
   "compilerOptions": {
     "outDir": "../out-tsc/spec",
     "types": [

ui-ngx/tsconfig.base.json

@@ -1,45 +0,0 @@
-{
-  "compileOnSave": false,
-  "compilerOptions": {
-    "baseUrl": "./",
-    "outDir": "./dist/out-tsc",
-    "sourceMap": true,
-    "declaration": false,
-    "module": "es2020",
-    "moduleResolution": "node",
-    "emitDecoratorMetadata": true,
-    "experimentalDecorators": true,
-    "allowSyntheticDefaultImports": true,
-    "importHelpers": true,
-    "target": "es5",
-    "jsx": "react",
-    "typeRoots": [
-      "node_modules/@types",
-      "src/typings/rawloader.typings.d.ts",
-      "src/typings/jquery.typings.d.ts",
-      "src/typings/jquery.flot.typings.d.ts",
-      "src/typings/jquery.jstree.typings.d.ts",
-      "src/typings/split.js.typings.d.ts",
-      "src/typings/add-marker.d.ts",
-      "src/typings/leaflet-editable.d.ts"
-    ],
-    "paths": {
-      "@app/*": ["src/app/*"],
-      "@env/*": [
-        "src/environments/*"
-      ],
-      "@core/*": ["src/app/core/*"],
-      "@modules/*": ["src/app/modules/*"],
-      "@shared/*": ["src/app/shared/*"],
-      "@home/*": ["src/app/modules/home/*"],
-      "jszip": [
-        "node_modules/jszip/dist/jszip.min.js"
-      ]
-    },
-    "lib": [
-      "es2018",
-      "es2019",
-      "dom"
-    ]
-  }
-}

ui-ngx/tsconfig.json

@@ -1,20 +1,45 @@
-/*
-  This is a "Solution Style" tsconfig.json file, and is used by editors and TypeScript’s language server to improve development experience.
-  It is not intended to be used to perform a compilation.
-
-  To learn more about this file see: https://angular.io/config/solution-tsconfig.
-*/
 {
-  "files": [],
+  "compileOnSave": false,
-  "references": [
+  "compilerOptions": {
-    {
+    "baseUrl": "./",
-      "path": "./src/tsconfig.app.json"
+    "outDir": "./dist/out-tsc",
+    "sourceMap": true,
+    "declaration": false,
+    "module": "es2020",
+    "moduleResolution": "node",
+    "emitDecoratorMetadata": true,
+    "experimentalDecorators": true,
+    "allowSyntheticDefaultImports": true,
+    "importHelpers": true,
+    "target": "es5",
+    "jsx": "react",
+    "typeRoots": [
+      "node_modules/@types",
+      "src/typings/rawloader.typings.d.ts",
+      "src/typings/jquery.typings.d.ts",
+      "src/typings/jquery.flot.typings.d.ts",
+      "src/typings/jquery.jstree.typings.d.ts",
+      "src/typings/split.js.typings.d.ts",
+      "src/typings/add-marker.d.ts",
+      "src/typings/leaflet-editable.d.ts"
+    ],
+    "paths": {
+      "@app/*": ["src/app/*"],
+      "@env/*": [
+        "src/environments/*"
+      ],
+      "@core/*": ["src/app/core/*"],
+      "@modules/*": ["src/app/modules/*"],
+      "@shared/*": ["src/app/shared/*"],
+      "@home/*": ["src/app/modules/home/*"],
+      "jszip": [
+        "node_modules/jszip/dist/jszip.min.js"
+      ]
     },
-    {
+    "lib": [
-      "path": "./src/tsconfig.spec.json"
+      "es2018",
-    },
+      "es2019",
-    {
+      "dom"
-      "path": "./e2e/tsconfig.e2e.json"
+    ]
-    }
+  }
-  ]
+}
-}