diff --git a/ui-ngx/.eslintrc.json b/ui-ngx/.eslintrc.json index 764733e4d7..598c8074a6 100644 --- a/ui-ngx/.eslintrc.json +++ b/ui-ngx/.eslintrc.json @@ -1,68 +1,69 @@ { - "root": true, - "ignorePatterns": [ - "projects/**/*" - ], - "overrides": [ - { - "files": [ - "*.ts" - ], - "parserOptions": { - "project": [ - "tsconfig.json", - "e2e/tsconfig.json" - ], - "createDefaultProgram": true - }, - "extends": [ - "plugin:@angular-eslint/ng-cli-compat", - "plugin:@angular-eslint/ng-cli-compat--formatting-add-on", - "plugin:@angular-eslint/template/process-inline-templates" - ], - "rules": { - "@typescript-eslint/explicit-member-accessibility": [ - "off", - { - "accessibility": "explicit" - } - ], - "arrow-parens": [ - "off", - "always" - ], - "@angular-eslint/component-selector": [ - "error", - { - "prefix": [ "tb" ] - } - ], - "id-blacklist": [ - "error", - "any", - "Number", - "String", - "string", - "Boolean", - "boolean", - "Undefined", - "undefined" - ], - "import/order": "off", - "@typescript-eslint/member-ordering": "off", - "no-underscore-dangle": "off", - "@typescript-eslint/naming-convention": "off", - "jsdoc/newline-after-description": 0 - } - }, - { - "files": [ - "*.html" - ], - "extends": [ - "plugin:@angular-eslint/template/recommended" - ], - "rules": {} - } - ] + "root": true, + "ignorePatterns": [ + "projects/**/*" + ], + "overrides": [ + { + "files": [ + "*.ts", + "*.tsx" + ], + "parserOptions": { + "project": [ + "tsconfig.json" + ], + "createDefaultProgram": true + }, + "extends": [ + "plugin:@angular-eslint/recommended", + "plugin:@angular-eslint/template/process-inline-templates" + ], + "rules": { + "@typescript-eslint/explicit-member-accessibility": [ + "off", + { + "accessibility": "explicit" + } + ], + "arrow-parens": [ + "off", + "always" + ], + "@angular-eslint/component-selector": [ + "error", + { + "prefix": [ + "tb" + ] + } + ], + "id-blacklist": [ + "error", + "any", + "Number", + "String", + "string", + "Boolean", + "boolean", + "Undefined", + "undefined" + ], + "import/order": "off", + "@typescript-eslint/member-ordering": "off", + "no-underscore-dangle": "off", + "@typescript-eslint/naming-convention": "off", + "jsdoc/newline-after-description": 0 + } + }, + { + "files": [ + "*.html" + ], + "extends": [ + "plugin:@angular-eslint/template/recommended" + ], + "rules": {} + } + ] } diff --git a/ui-ngx/angular.json b/ui-ngx/angular.json index 10c904f88d..5b661e154f 100644 --- a/ui-ngx/angular.json +++ b/ui-ngx/angular.json @@ -217,15 +217,15 @@ "serve": { "builder": "@angular-builders/custom-webpack:dev-server", "options": { - "browserTarget": "thingsboard:build", + "buildTarget": "thingsboard:build", "proxyConfig": "proxy.conf.js" }, "configurations": { "production": { - "browserTarget": "thingsboard:build:production" + "buildTarget": "thingsboard:build:production" }, "development": { - "browserTarget": "thingsboard:build:development" + "buildTarget": "thingsboard:build:development" } }, "defaultConfiguration": "development" @@ -233,24 +233,7 @@ "extract-i18n": { "builder": "@angular-devkit/build-angular:extract-i18n", "options": { - "browserTarget": "thingsboard:build" - } - }, - "test": { - "builder": "@angular-devkit/build-angular:karma", - "options": { - "main": "src/test.ts", - "polyfills": "src/polyfills.ts", - "tsConfig": "src/tsconfig.spec.json", - "karmaConfig": "src/karma.conf.js", - "styles": [ - "src/styles.scss" - ], - "scripts": [], - "assets": [ - "src/favicon.ico", - "src/assets" - ] + "buildTarget": "thingsboard:build" } }, "lint": { @@ -263,25 +246,6 @@ } } } - }, - "thingsboard-e2e": { - "root": "e2e/", - "projectType": "application", - "prefix": "", - "architect": { - "e2e": { - "builder": "@angular-devkit/build-angular:protractor", - "options": { - "protractorConfig": "e2e/protractor.conf.js", - "devServerTarget": "thingsboard:serve" - }, - "configurations": { - "production": { - "devServerTarget": "thingsboard:serve:production" - } - } - } - } } }, "cli": { diff --git a/ui-ngx/e2e/protractor.conf.js b/ui-ngx/e2e/protractor.conf.js deleted file mode 100644 index 20c3ebfd66..0000000000 --- a/ui-ngx/e2e/protractor.conf.js +++ /dev/null @@ -1,43 +0,0 @@ -/* - * Copyright © 2016-2024 The Thingsboard Authors - * - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ -// Protractor configuration file, see link for more information -// https://github.com/angular/protractor/blob/master/lib/config.ts - -const { SpecReporter } = require("jasmine-spec-reporter"); - -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.e2e.json"), - }); - jasmine.getEnv().addReporter(new SpecReporter({ spec: { displayStacktrace: true } })); - }, -}; diff --git a/ui-ngx/e2e/src/app.e2e-spec.ts b/ui-ngx/e2e/src/app.e2e-spec.ts deleted file mode 100644 index 88412e7669..0000000000 --- a/ui-ngx/e2e/src/app.e2e-spec.ts +++ /dev/null @@ -1,39 +0,0 @@ -/// -/// Copyright © 2016-2024 The Thingsboard Authors -/// -/// Licensed under the Apache License, Version 2.0 (the "License"); -/// you may not use this file except in compliance with the License. -/// You may obtain a copy of the License at -/// -/// http://www.apache.org/licenses/LICENSE-2.0 -/// -/// Unless required by applicable law or agreed to in writing, software -/// distributed under the License is distributed on an "AS IS" BASIS, -/// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. -/// See the License for the specific language governing permissions and -/// limitations under the License. -/// - -import { AppPage } from './app.po'; -import { browser, logging } from 'protractor'; - -describe('workspace-project App', () => { - let page: AppPage; - - beforeEach(() => { - page = new AppPage(); - }); - - it('should display welcome message', () => { - page.navigateTo(); - expect(page.getTitleText()).toEqual('Welcome to tb-license-server!'); - }); - - 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)); - }); -}); diff --git a/ui-ngx/e2e/src/app.po.ts b/ui-ngx/e2e/src/app.po.ts deleted file mode 100644 index 5064eb2e1b..0000000000 --- a/ui-ngx/e2e/src/app.po.ts +++ /dev/null @@ -1,27 +0,0 @@ -/// -/// Copyright © 2016-2024 The Thingsboard Authors -/// -/// Licensed under the Apache License, Version 2.0 (the "License"); -/// you may not use this file except in compliance with the License. -/// You may obtain a copy of the License at -/// -/// http://www.apache.org/licenses/LICENSE-2.0 -/// -/// Unless required by applicable law or agreed to in writing, software -/// distributed under the License is distributed on an "AS IS" BASIS, -/// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. -/// See the License for the specific language governing permissions and -/// limitations under the License. -/// - -import { browser, by, element } from 'protractor'; - -export class AppPage { - navigateTo() { - return browser.get(browser.baseUrl) as Promise; - } - - getTitleText() { - return element(by.css('tb-root h1')).getText() as Promise; - } -} diff --git a/ui-ngx/e2e/tsconfig.e2e.json b/ui-ngx/e2e/tsconfig.e2e.json deleted file mode 100644 index 77d311e88d..0000000000 --- a/ui-ngx/e2e/tsconfig.e2e.json +++ /dev/null @@ -1,13 +0,0 @@ -{ - "extends": "../tsconfig.json", - "compilerOptions": { - "outDir": "../out-tsc/app", - "module": "commonjs", - "target": "es5", - "types": [ - "jasmine", - "jasminewd2", - "node" - ] - } -} diff --git a/ui-ngx/extra-webpack.config.js b/ui-ngx/extra-webpack.config.js index 4c896eea64..2191d0a24c 100644 --- a/ui-ngx/extra-webpack.config.js +++ b/ui-ngx/extra-webpack.config.js @@ -14,7 +14,7 @@ * limitations under the License. */ const CompressionPlugin = require("compression-webpack-plugin"); -const JavaScriptOptimizerPlugin = require("@angular-devkit/build-angular/src/webpack/plugins/javascript-optimizer-plugin").JavaScriptOptimizerPlugin; +const JavaScriptOptimizerPlugin = require("@angular-devkit/build-angular/src/tools/webpack/plugins/javascript-optimizer-plugin").JavaScriptOptimizerPlugin; const webpack = require("webpack"); const dirTree = require("directory-tree"); const ngWebpack = require('@ngtools/webpack'); diff --git a/ui-ngx/package.json b/ui-ngx/package.json index 4427398f63..5f67ac948f 100644 --- a/ui-ngx/package.json +++ b/ui-ngx/package.json @@ -8,172 +8,163 @@ "build:prod": "node --max_old_space_size=4096 ./node_modules/@angular/cli/bin/ng build --configuration production --vendor-chunk", "build:types": "node generate-types.js", "build:icon-metadata": "node generate-icon-metadata.js", - "test": "ng test", "lint": "ng lint", - "e2e": "ng e2e", "prepare": "patch-package" }, "private": true, "dependencies": { - "@angular/animations": "^15.2.10", - "@angular/cdk": "^15.2.9", - "@angular/common": "^15.2.10", - "@angular/compiler": "^15.2.10", - "@angular/core": "^15.2.10", + "@angular/animations": "18.2.6", + "@angular/cdk": "18.2.6", + "@angular/common": "18.2.6", + "@angular/compiler": "18.2.6", + "@angular/core": "18.2.6", "@angular/flex-layout": "^15.0.0-beta.42", - "@angular/forms": "^15.2.10", - "@angular/material": "^15.2.9", - "@angular/platform-browser": "^15.2.10", - "@angular/platform-browser-dynamic": "^15.2.10", - "@angular/router": "^15.2.10", - "@auth0/angular-jwt": "^5.1.2", - "@date-io/core": "1.3.7", - "@date-io/date-fns": "1.3.7", + "@angular/forms": "18.2.6", + "@angular/material": "18.2.6", + "@angular/platform-browser": "18.2.6", + "@angular/platform-browser-dynamic": "18.2.6", + "@angular/router": "18.2.6", + "@auth0/angular-jwt": "^5.2.0", + "@emotion/react": "11.13.3", + "@emotion/styled": "11.13.0", "@flowjs/flow.js": "^2.14.1", - "@flowjs/ngx-flow": "~0.6.0", - "@geoman-io/leaflet-geoman-free": "2.14.2", - "@iplab/ngx-color-picker": "^15.0.2", - "@mat-datetimepicker/core": "~11.0.3", - "@material-ui/core": "4.12.3", - "@material-ui/icons": "4.11.2", - "@material-ui/pickers": "3.3.10", - "@mdi/svg": "^7.2.96", - "@messageformat/core": "^3.1.0", - "@ngrx/effects": "^15.4.0", - "@ngrx/store": "^15.4.0", - "@ngrx/store-devtools": "^15.4.0", - "@ngx-translate/core": "^14.0.0", + "@flowjs/ngx-flow": "~0.8.1", + "@fortawesome/fontawesome-svg-core": "^6.6.0", + "@geoman-io/leaflet-geoman-free": "2.17.0", + "@iplab/ngx-color-picker": "^18.0.1", + "@mat-datetimepicker/core": "~14.0.0", + "@mdi/svg": "^7.4.47", + "@messageformat/core": "^3.4.0", + "@mui/icons-material": "6.1.2", + "@mui/lab": "6.0.0-beta.10", + "@mui/material": "6.1.2", + "@mui/styles": "6.1.2", + "@mui/system": "6.1.2", + "@mui/x-date-pickers": "7.18.0", + "@ngrx/effects": "^18.0.2", + "@ngrx/store": "^18.0.2", + "@ngrx/store-devtools": "^18.0.2", + "@ngx-translate/core": "^15.0.0", "@svgdotjs/svg.filter.js": "^3.0.8", - "@svgdotjs/svg.js": "^3.2.0", + "@svgdotjs/svg.js": "^3.2.4", "@svgdotjs/svg.panzoom.js": "^2.1.2", - "@tinymce/tinymce-angular": "^7.0.0", - "ace-builds": "1.4.13", + "@tinymce/tinymce-angular": "^8.0.1", + "ace-builds": "1.36.2", "ace-diff": "^3.0.3", - "angular-gridster2": "~15.0.4", - "angular2-hotkeys": "^13.1.0", + "angular-gridster2": "~18.0.1", + "angular2-hotkeys": "^16.0.1", "canvas-gauges": "^2.1.7", - "core-js": "^3.29.1", - "date-fns": "2.0.0-alpha.27", - "dayjs": "1.11.4", + "core-js": "^3.38.1", + "dayjs": "1.11.13", "echarts": "https://github.com/thingsboard/echarts/archive/5.5.0-TB.tar.gz", "flot": "https://github.com/thingsboard/flot.git#0.9-work", "flot.curvedlines": "https://github.com/MichaelZinsmaier/CurvedLines.git#master", "font-awesome": "^4.7.0", "html2canvas": "^1.4.1", "jquery": "^3.7.1", - "jquery.terminal": "^2.35.3", - "js-beautify": "1.14.7", + "jquery.terminal": "^2.43.1", + "js-beautify": "1.15.1", "json-schema-defaults": "^0.4.0", - "jstree": "^3.3.15", + "jstree": "^3.3.17", "jstree-bootstrap-theme": "^1.0.1", "jszip": "^3.10.1", - "leaflet": "1.8.0", + "leaflet": "1.9.4", "leaflet-polylinedecorator": "1.6.0", - "leaflet-providers": "1.13.0", + "leaflet-providers": "2.0.0", "leaflet.gridlayer.googlemutant": "0.14.1", "leaflet.markercluster": "1.5.3", - "libphonenumber-js": "^1.10.4", - "marked": "^4.0.17", - "moment": "^2.29.4", - "moment-timezone": "^0.5.42", - "ngx-clipboard": "^15.1.0", + "libphonenumber-js": "^1.11.10", + "marked": "~12.0.2", + "moment": "^2.30.1", + "moment-timezone": "^0.5.45", + "ngx-clipboard": "^16.0.0", "ngx-daterangepicker-material": "^6.0.4", - "ngx-drag-drop": "^15.0.1", - "ngx-flowchart": "https://github.com/thingsboard/ngx-flowchart.git#release/2.0.0", - "ngx-hm-carousel": "^3.0.0", - "ngx-markdown": "^15.1.2", - "ngx-sharebuttons": "^12.0.0", - "ngx-translate-messageformat-compiler": "^6.2.0", + "ngx-drag-drop": "^18.0.2", + "ngx-flowchart": "https://github.com/thingsboard/ngx-flowchart.git#release/3.0.0", + "ngx-hm-carousel": "^18.0.0", + "ngx-markdown": "^18.1.0", + "ngx-sharebuttons": "^15.0.3", + "ngx-translate-messageformat-compiler": "^7.0.0", "objectpath": "^2.0.0", "prettier": "^2.8.3", "prop-types": "^15.8.1", - "qrcode": "^1.5.1", + "qrcode": "^1.5.4", "raphael": "^2.3.0", - "rc-select": "13.2.1", - "react": "17.0.2", - "react-ace": "9.5.0", - "react-dom": "17.0.2", - "react-dropzone": "^11.4.2", + "rc-select": "14.15.2", + "react": "18.3.1", + "react-ace": "12.0.0", + "react-dom": "18.3.1", + "react-dropzone": "14.2.9", "reactcss": "^1.2.3", - "rxjs": "~7.8.0", - "schema-inspector": "^2.0.2", + "rxjs": "~7.8.1", + "schema-inspector": "^2.1.0", "screenfull": "^6.0.2", "sorted-btree": "^1.8.1", "split.js": "^1.6.5", - "systemjs": "6.14.1", + "systemjs": "6.15.1", "tinycolor2": "^1.6.0", - "tinymce": "~5.10.7", + "tinymce": "~6.8.4", "tooltipster": "^4.2.8", "ts-transformer-keys": "^0.4.4", - "tslib": "^2.5.0", + "tslib": "^2.7.0", "tv4": "^1.3.0", "typeface-roboto": "^1.1.13", - "zone.js": "~0.13.0" + "zone.js": "~0.14.10" }, "devDependencies": { - "@angular-builders/custom-webpack": "~15.0.0", - "@angular-devkit/build-angular": "^15.2.10", - "@angular-eslint/builder": "15.2.1", - "@angular-eslint/eslint-plugin": "15.2.1", - "@angular-eslint/eslint-plugin-template": "15.2.1", - "@angular-eslint/schematics": "15.2.1", - "@angular-eslint/template-parser": "15.2.1", - "@angular/cli": "^15.2.10", - "@angular/compiler-cli": "^15.2.10", - "@angular/language-service": "^15.2.10", - "@ngtools/webpack": "15.2.10", - "@types/ace-diff": "^2.1.1", - "@types/canvas-gauges": "^2.1.4", - "@types/flot": "^0.0.32", - "@types/flowjs": "^2.13.9", - "@types/jasmine": "~3.10.2", - "@types/jasminewd2": "^2.0.10", - "@types/jquery": "^3.5.30", - "@types/js-beautify": "^1.13.3", - "@types/leaflet": "1.8.0", + "@angular-builders/custom-webpack": "~18.0.0", + "@angular-devkit/build-angular": "18.2.7", + "@angular-devkit/core": "18.2.7", + "@angular-devkit/schematics": "18.2.7", + "@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.7", + "@angular/compiler-cli": "18.2.6", + "@angular/language-service": "18.2.6", + "@ngtools/webpack": "18.2.7", + "@types/ace-diff": "^2.1.4", + "@types/canvas-gauges": "^2.1.8", + "@types/flot": "^0.0.36", + "@types/flowjs": "^2.13.14", + "@types/jquery": "^3.5.31", + "@types/js-beautify": "^1.14.3", + "@types/leaflet": "1.9.12", "@types/leaflet-polylinedecorator": "1.6.4", "@types/leaflet-providers": "1.2.4", "@types/leaflet.gridlayer.googlemutant": "0.4.9", "@types/leaflet.markercluster": "1.5.4", - "@types/lodash": "^4.14.192", - "@types/marked": "^4.0.8", + "@types/lodash": "^4.17.10", "@types/node": "~18.15.11", - "@types/raphael": "^2.3.2", - "@types/react": "17.0.37", - "@types/react-dom": "17.0.11", - "@types/systemjs": "6.13.1", - "@types/tinycolor2": "^1.4.3", - "@types/tooltipster": "^0.0.31", - "@typescript-eslint/eslint-plugin": "5.57.0", - "@typescript-eslint/parser": "5.57.0", - "compression-webpack-plugin": "^10.0.0", - "directory-tree": "^3.5.1", - "eslint": "^8.37.0", + "@types/raphael": "^2.3.9", + "@types/react": "18.3.10", + "@types/react-dom": "18.3.0", + "@types/systemjs": "6.15.1", + "@types/tinycolor2": "^1.4.6", + "@types/tooltipster": "^0.0.35", + "@typescript-eslint/eslint-plugin": "^8.7.0", + "@typescript-eslint/parser": "^8.7.0", + "@typescript-eslint/utils": "^8.7.0", + "compression-webpack-plugin": "^11.1.0", + "directory-tree": "^3.5.2", + "eslint": "~8.57.1", "eslint-plugin-import": "latest", "eslint-plugin-jsdoc": "latest", "eslint-plugin-prefer-arrow": "latest", - "jasmine-core": "~3.10.1", - "jasmine-spec-reporter": "~7.0.0", - "karma": "~6.3.9", - "karma-chrome-launcher": "~3.1.0", - "karma-coverage-istanbul-reporter": "~3.0.3", - "karma-jasmine": "~4.0.1", - "karma-jasmine-html-reporter": "^1.7.0", "ngrx-store-freeze": "^0.2.4", - "patch-package": "^6.5.1", + "patch-package": "^8.0.0", "postinstall-prepare": "^2.0.0", - "protractor": "~7.0.0", "raw-loader": "^4.0.2", - "ts-node": "^10.9.1", - "typescript": "~4.9.5", - "webpack": "5.77.0" + "ts-node": "^10.9.2", + "typescript": "~5.5.4", + "webpack": "5.95.0" }, "resolutions": { - "@types/react": "17.0.37", - "ace-builds": "1.4.13", - "@date-io/core": "1.3.7", - "rc-virtual-list": "3.4.13", - "read-package-json": "6.0.0", - "cacache": "17.0.4" + "@types/react": "18.3.10", + "rc-virtual-list": "3.5.2", + "ace-builds": "1.36.2", + "tinymce": "6.8.4" } } diff --git a/ui-ngx/patches/@angular+core+15.2.10.patch b/ui-ngx/patches/@angular+core+18.2.6.patch similarity index 78% rename from ui-ngx/patches/@angular+core+15.2.10.patch rename to ui-ngx/patches/@angular+core+18.2.6.patch index 3265415263..1f9427d2b3 100644 --- a/ui-ngx/patches/@angular+core+15.2.10.patch +++ b/ui-ngx/patches/@angular+core+18.2.6.patch @@ -1,8 +1,8 @@ -diff --git a/node_modules/@angular/core/fesm2020/core.mjs b/node_modules/@angular/core/fesm2020/core.mjs -index e9a9b75..17044d9 100755 ---- a/node_modules/@angular/core/fesm2020/core.mjs -+++ b/node_modules/@angular/core/fesm2020/core.mjs -@@ -11053,13 +11053,13 @@ function findDirectiveDefMatches(tView, tNode) { +diff --git a/node_modules/@angular/core/fesm2022/core.mjs b/node_modules/@angular/core/fesm2022/core.mjs +index 0fa881f..b844dfa 100755 +--- a/node_modules/@angular/core/fesm2022/core.mjs ++++ b/node_modules/@angular/core/fesm2022/core.mjs +@@ -12868,13 +12868,13 @@ function findDirectiveDefMatches(tView, tNode) { if (isNodeMatchingSelectorList(tNode, def.selectors, /* isProjectionMode */ false)) { matches || (matches = []); if (isComponentDef(def)) { diff --git a/ui-ngx/patches/@angular+flex-layout+15.0.0-beta.42.patch b/ui-ngx/patches/@angular+flex-layout+15.0.0-beta.42.patch new file mode 100644 index 0000000000..d4bf9d42cd --- /dev/null +++ b/ui-ngx/patches/@angular+flex-layout+15.0.0-beta.42.patch @@ -0,0 +1,21 @@ +diff --git a/node_modules/@angular/flex-layout/fesm2020/angular-flex-layout-extended.mjs b/node_modules/@angular/flex-layout/fesm2020/angular-flex-layout-extended.mjs +index 735dff5..52b6392 100644 +--- a/node_modules/@angular/flex-layout/fesm2020/angular-flex-layout-extended.mjs ++++ b/node_modules/@angular/flex-layout/fesm2020/angular-flex-layout-extended.mjs +@@ -124,7 +124,7 @@ class ClassDirective extends BaseDirective2 { + if (!this.ngClassInstance) { + // Create an instance NgClass Directive instance only if `ngClass=""` has NOT been defined on + // the same host element; since the responsive variations may be defined... +- this.ngClassInstance = new NgClass(iterableDiffers, keyValueDiffers, elementRef, renderer2); ++ this.ngClassInstance = new NgClass(elementRef, renderer2); + } + this.init(); + this.setValue('', ''); +diff --git a/node_modules/@angular/flex-layout/fesm2020/angular-flex-layout-extended.mjs.map b/node_modules/@angular/flex-layout/fesm2020/angular-flex-layout-extended.mjs.map +index a184784..2d0682e 100644 +--- a/node_modules/@angular/flex-layout/fesm2020/angular-flex-layout-extended.mjs.map ++++ b/node_modules/@angular/flex-layout/fesm2020/angular-flex-layout-extended.mjs.map +@@ -1 +1 @@ +-{"version":3,"file":"angular-flex-layout-extended.mjs","sources":["../../../../projects/libs/flex-layout/extended/img-src/img-src.ts","../../../../projects/libs/flex-layout/extended/class/class.ts","../../../../projects/libs/flex-layout/extended/show-hide/show-hide.ts","../../../../projects/libs/flex-layout/extended/style/style-transforms.ts","../../../../projects/libs/flex-layout/extended/style/style.ts","../../../../projects/libs/flex-layout/extended/module.ts","../../../../projects/libs/flex-layout/extended/public-api.ts","../../../../projects/libs/flex-layout/extended/angular-flex-layout-extended.ts"],"sourcesContent":["/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.io/license\n */\nimport {Directive, ElementRef, Inject, PLATFORM_ID, Injectable, Input} from '@angular/core';\nimport {isPlatformServer} from '@angular/common';\nimport {\n MediaMarshaller,\n BaseDirective2,\n SERVER_TOKEN,\n StyleBuilder,\n StyleDefinition,\n StyleUtils,\n} from '@angular/flex-layout/core';\n\n@Injectable({providedIn: 'root'})\nexport class ImgSrcStyleBuilder extends StyleBuilder {\n buildStyles(url: string) {\n return {'content': url ? `url(${url})` : ''};\n }\n}\n\n@Directive()\nexport class ImgSrcDirective extends BaseDirective2 {\n protected override DIRECTIVE_KEY = 'img-src';\n protected defaultSrc = '';\n\n @Input('src')\n set src(val: string) {\n this.defaultSrc = val;\n this.setValue(this.defaultSrc, '');\n }\n\n constructor(elementRef: ElementRef,\n styleBuilder: ImgSrcStyleBuilder,\n styler: StyleUtils,\n marshal: MediaMarshaller,\n @Inject(PLATFORM_ID) protected platformId: Object,\n @Inject(SERVER_TOKEN) protected serverModuleLoaded: boolean) {\n super(elementRef, styleBuilder, styler, marshal);\n this.init();\n this.setValue(this.nativeElement.getAttribute('src') || '', '');\n if (isPlatformServer(this.platformId) && this.serverModuleLoaded) {\n this.nativeElement.setAttribute('src', '');\n }\n }\n\n /**\n * Use the [responsively] activated input value to update\n * the host img src attribute or assign a default `img.src=''`\n * if the src has not been defined.\n *\n * Do nothing to standard `` usages, only when responsive\n * keys are present do we actually call `setAttribute()`\n */\n protected override updateWithValue(value?: string) {\n const url = value || this.defaultSrc;\n if (isPlatformServer(this.platformId) && this.serverModuleLoaded) {\n this.addStyles(url);\n } else {\n this.nativeElement.setAttribute('src', url);\n }\n }\n\n protected override styleCache = imgSrcCache;\n}\n\nconst imgSrcCache: Map = new Map();\n\nconst inputs = [\n 'src.xs', 'src.sm', 'src.md', 'src.lg', 'src.xl',\n 'src.lt-sm', 'src.lt-md', 'src.lt-lg', 'src.lt-xl',\n 'src.gt-xs', 'src.gt-sm', 'src.gt-md', 'src.gt-lg'\n];\n\nconst selector = `\n img[src.xs], img[src.sm], img[src.md], img[src.lg], img[src.xl],\n img[src.lt-sm], img[src.lt-md], img[src.lt-lg], img[src.lt-xl],\n img[src.gt-xs], img[src.gt-sm], img[src.gt-md], img[src.gt-lg]\n`;\n\n/**\n * This directive provides a responsive API for the HTML 'src' attribute\n * and will update the img.src property upon each responsive activation.\n *\n * e.g.\n * \n *\n * @see https://css-tricks.com/responsive-images-youre-just-changing-resolutions-use-src/\n */\n@Directive({selector, inputs})\nexport class DefaultImgSrcDirective extends ImgSrcDirective {\n protected override inputs = inputs;\n}\n","/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.io/license\n */\nimport {\n Directive,\n DoCheck,\n ElementRef,\n Input,\n IterableDiffers,\n KeyValueDiffers,\n Optional,\n Renderer2,\n Self,\n} from '@angular/core';\nimport {NgClass} from '@angular/common';\nimport {BaseDirective2, StyleUtils, MediaMarshaller} from '@angular/flex-layout/core';\n\n@Directive()\nexport class ClassDirective extends BaseDirective2 implements DoCheck {\n\n protected override DIRECTIVE_KEY = 'ngClass';\n\n /**\n * Capture class assignments so we cache the default classes\n * which are merged with activated styles and used as fallbacks.\n */\n @Input('class')\n set klass(val: string) {\n this.ngClassInstance.klass = val;\n this.setValue(val, '');\n }\n\n constructor(elementRef: ElementRef,\n styler: StyleUtils,\n marshal: MediaMarshaller,\n iterableDiffers: IterableDiffers,\n keyValueDiffers: KeyValueDiffers,\n renderer2: Renderer2,\n @Optional() @Self() protected readonly ngClassInstance: NgClass) {\n super(elementRef, null!, styler, marshal);\n if (!this.ngClassInstance) {\n // Create an instance NgClass Directive instance only if `ngClass=\"\"` has NOT been defined on\n // the same host element; since the responsive variations may be defined...\n this.ngClassInstance = new NgClass(iterableDiffers, keyValueDiffers, elementRef, renderer2);\n }\n this.init();\n this.setValue('', '');\n }\n\n protected override updateWithValue(value: any) {\n this.ngClassInstance.ngClass = value;\n this.ngClassInstance.ngDoCheck();\n }\n\n // ******************************************************************\n // Lifecycle Hooks\n // ******************************************************************\n\n /**\n * For ChangeDetectionStrategy.onPush and ngOnChanges() updates\n */\n ngDoCheck() {\n this.ngClassInstance.ngDoCheck();\n }\n}\n\nconst inputs = [\n 'ngClass', 'ngClass.xs', 'ngClass.sm', 'ngClass.md', 'ngClass.lg', 'ngClass.xl',\n 'ngClass.lt-sm', 'ngClass.lt-md', 'ngClass.lt-lg', 'ngClass.lt-xl',\n 'ngClass.gt-xs', 'ngClass.gt-sm', 'ngClass.gt-md', 'ngClass.gt-lg'\n];\n\nconst selector = `\n [ngClass], [ngClass.xs], [ngClass.sm], [ngClass.md], [ngClass.lg], [ngClass.xl],\n [ngClass.lt-sm], [ngClass.lt-md], [ngClass.lt-lg], [ngClass.lt-xl],\n [ngClass.gt-xs], [ngClass.gt-sm], [ngClass.gt-md], [ngClass.gt-lg]\n`;\n\n/**\n * Directive to add responsive support for ngClass.\n * This maintains the core functionality of 'ngClass' and adds responsive API\n * Note: this class is a no-op when rendered on the server\n */\n@Directive({selector, inputs})\nexport class DefaultClassDirective extends ClassDirective {\n protected override inputs = inputs;\n}\n","/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.io/license\n */\nimport {\n Directive,\n ElementRef,\n OnChanges,\n SimpleChanges,\n Inject,\n PLATFORM_ID,\n Injectable,\n AfterViewInit,\n} from '@angular/core';\nimport {isPlatformServer} from '@angular/common';\nimport {\n BaseDirective2,\n LAYOUT_CONFIG,\n LayoutConfigOptions,\n MediaMarshaller,\n SERVER_TOKEN,\n StyleUtils,\n StyleBuilder,\n} from '@angular/flex-layout/core';\nimport {coerceBooleanProperty} from '@angular/cdk/coercion';\nimport {takeUntil} from 'rxjs/operators';\n\nexport interface ShowHideParent {\n display: string;\n isServer: boolean;\n}\n\n@Injectable({providedIn: 'root'})\nexport class ShowHideStyleBuilder extends StyleBuilder {\n buildStyles(show: string, parent: ShowHideParent) {\n const shouldShow = show === 'true';\n return {'display': shouldShow ? parent.display || (parent.isServer ? 'initial' : '') : 'none'};\n }\n}\n\n@Directive()\nexport class ShowHideDirective extends BaseDirective2 implements AfterViewInit, OnChanges {\n protected override DIRECTIVE_KEY = 'show-hide';\n\n /** Original DOM Element CSS display style */\n protected display: string = '';\n protected hasLayout = false;\n protected hasFlexChild = false;\n\n constructor(elementRef: ElementRef,\n styleBuilder: ShowHideStyleBuilder,\n styler: StyleUtils,\n marshal: MediaMarshaller,\n @Inject(LAYOUT_CONFIG) protected layoutConfig: LayoutConfigOptions,\n @Inject(PLATFORM_ID) protected platformId: Object,\n @Inject(SERVER_TOKEN) protected serverModuleLoaded: boolean) {\n super(elementRef, styleBuilder, styler, marshal);\n }\n\n // *********************************************\n // Lifecycle Methods\n // *********************************************\n\n ngAfterViewInit() {\n this.trackExtraTriggers();\n\n const children = Array.from(this.nativeElement.children);\n for (let i = 0; i < children.length; i++) {\n if (this.marshal.hasValue(children[i] as HTMLElement, 'flex')) {\n this.hasFlexChild = true;\n break;\n }\n }\n\n if (DISPLAY_MAP.has(this.nativeElement)) {\n this.display = DISPLAY_MAP.get(this.nativeElement)!;\n } else {\n this.display = this.getDisplayStyle();\n DISPLAY_MAP.set(this.nativeElement, this.display);\n }\n\n this.init();\n // set the default to show unless explicitly overridden\n const defaultValue = this.marshal.getValue(this.nativeElement, this.DIRECTIVE_KEY, '');\n if (defaultValue === undefined || defaultValue === '') {\n this.setValue(true, '');\n } else {\n this.triggerUpdate();\n }\n }\n\n /**\n * On changes to any @Input properties...\n * Default to use the non-responsive Input value ('fxShow')\n * Then conditionally override with the mq-activated Input's current value\n */\n override ngOnChanges(changes: SimpleChanges) {\n Object.keys(changes).forEach(key => {\n if (this.inputs.indexOf(key) !== -1) {\n const inputKey = key.split('.');\n const bp = inputKey.slice(1).join('.');\n const inputValue = changes[key].currentValue;\n let shouldShow = inputValue !== '' ?\n inputValue !== 0 ? coerceBooleanProperty(inputValue) : false\n : true;\n if (inputKey[0] === 'fxHide') {\n shouldShow = !shouldShow;\n }\n this.setValue(shouldShow, bp);\n }\n });\n }\n\n // *********************************************\n // Protected methods\n // *********************************************\n\n /**\n * Watch for these extra triggers to update fxShow, fxHide stylings\n */\n protected trackExtraTriggers() {\n this.hasLayout = this.marshal.hasValue(this.nativeElement, 'layout');\n\n ['layout', 'layout-align'].forEach(key => {\n this.marshal\n .trackValue(this.nativeElement, key)\n .pipe(takeUntil(this.destroySubject))\n .subscribe(this.triggerUpdate.bind(this));\n });\n }\n\n /**\n * Override accessor to the current HTMLElement's `display` style\n * Note: Show/Hide will not change the display to 'flex' but will set it to 'block'\n * unless it was already explicitly specified inline or in a CSS stylesheet.\n */\n protected getDisplayStyle(): string {\n return (this.hasLayout || (this.hasFlexChild && this.layoutConfig.addFlexToParent)) ?\n 'flex' : this.styler.lookupStyle(this.nativeElement, 'display', true);\n }\n\n /** Validate the visibility value and then update the host's inline display style */\n protected override updateWithValue(value: boolean | string = true) {\n if (value === '') {\n return;\n }\n const isServer = isPlatformServer(this.platformId);\n this.addStyles(value ? 'true' : 'false', {display: this.display, isServer});\n if (isServer && this.serverModuleLoaded) {\n this.nativeElement.style.setProperty('display', '');\n }\n this.marshal.triggerUpdate(this.parentElement!, 'layout-gap');\n }\n}\n\nconst DISPLAY_MAP: WeakMap = new WeakMap();\n\nconst inputs = [\n 'fxShow', 'fxShow.print',\n 'fxShow.xs', 'fxShow.sm', 'fxShow.md', 'fxShow.lg', 'fxShow.xl',\n 'fxShow.lt-sm', 'fxShow.lt-md', 'fxShow.lt-lg', 'fxShow.lt-xl',\n 'fxShow.gt-xs', 'fxShow.gt-sm', 'fxShow.gt-md', 'fxShow.gt-lg',\n 'fxHide', 'fxHide.print',\n 'fxHide.xs', 'fxHide.sm', 'fxHide.md', 'fxHide.lg', 'fxHide.xl',\n 'fxHide.lt-sm', 'fxHide.lt-md', 'fxHide.lt-lg', 'fxHide.lt-xl',\n 'fxHide.gt-xs', 'fxHide.gt-sm', 'fxHide.gt-md', 'fxHide.gt-lg'\n];\n\nconst selector = `\n [fxShow], [fxShow.print],\n [fxShow.xs], [fxShow.sm], [fxShow.md], [fxShow.lg], [fxShow.xl],\n [fxShow.lt-sm], [fxShow.lt-md], [fxShow.lt-lg], [fxShow.lt-xl],\n [fxShow.gt-xs], [fxShow.gt-sm], [fxShow.gt-md], [fxShow.gt-lg],\n [fxHide], [fxHide.print],\n [fxHide.xs], [fxHide.sm], [fxHide.md], [fxHide.lg], [fxHide.xl],\n [fxHide.lt-sm], [fxHide.lt-md], [fxHide.lt-lg], [fxHide.lt-xl],\n [fxHide.gt-xs], [fxHide.gt-sm], [fxHide.gt-md], [fxHide.gt-lg]\n`;\n\n/**\n * 'show' Layout API directive\n */\n@Directive({selector, inputs})\nexport class DefaultShowHideDirective extends ShowHideDirective {\n protected override inputs = inputs;\n}\n","/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.io/license\n */\n\nexport type NgStyleRawList = string[];\nexport type NgStyleMap = {[klass: string]: string};\n// NgStyle selectors accept NgStyleType values\nexport type NgStyleType = string | Set | NgStyleRawList | NgStyleMap;\n\n/**\n * Callback function for SecurityContext.STYLE sanitization\n */\nexport type NgStyleSanitizer = (val: any) => string;\n\n/** NgStyle allowed inputs */\nexport class NgStyleKeyValue {\n constructor(public key: string, public value: string, noQuotes = true) {\n this.key = noQuotes ? key.replace(/['\"]/g, '').trim() : key.trim();\n\n this.value = noQuotes ? value.replace(/['\"]/g, '').trim() : value.trim();\n this.value = this.value.replace(/;/, '');\n }\n}\n\nexport function getType(target: any): string {\n let what = typeof target;\n if (what === 'object') {\n return (target.constructor === Array) ? 'array' :\n (target.constructor === Set) ? 'set' : 'object';\n }\n return what;\n}\n\n/**\n * Split string of key:value pairs into Array of k-v pairs\n * e.g. 'key:value; key:value; key:value;' -> ['key:value',...]\n */\nexport function buildRawList(source: any, delimiter = ';'): NgStyleRawList {\n return String(source)\n .trim()\n .split(delimiter)\n .map((val: string) => val.trim())\n .filter(val => val !== '');\n}\n\n/** Convert array of key:value strings to a iterable map object */\nexport function buildMapFromList(styles: NgStyleRawList, sanitize?: NgStyleSanitizer): NgStyleMap {\n const sanitizeValue = (it: NgStyleKeyValue) => {\n if (sanitize) {\n it.value = sanitize(it.value);\n }\n return it;\n };\n\n return styles\n .map(stringToKeyValue)\n .filter(entry => !!entry)\n .map(sanitizeValue)\n .reduce(keyValuesToMap, {} as NgStyleMap);\n}\n\n/** Convert Set or raw Object to an iterable NgStyleMap */\nexport function buildMapFromSet(source: NgStyleType, sanitize?: NgStyleSanitizer): NgStyleMap {\n let list: string[] = [];\n if (getType(source) === 'set') {\n (source as Set).forEach(entry => list.push(entry));\n } else {\n Object.keys(source).forEach((key: string) => {\n list.push(`${key}:${(source as NgStyleMap)[key]}`);\n });\n }\n return buildMapFromList(list, sanitize);\n}\n\n\n/** Convert 'key:value' -> [key, value] */\nexport function stringToKeyValue(it: string): NgStyleKeyValue {\n const [key, ...vals] = it.split(':');\n return new NgStyleKeyValue(key, vals.join(':'));\n}\n\n/** Convert [ [key,value] ] -> { key : value } */\nexport function keyValuesToMap(map: NgStyleMap, entry: NgStyleKeyValue): NgStyleMap {\n if (!!entry.key) {\n map[entry.key] = entry.value;\n }\n return map;\n}\n","/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.io/license\n */\nimport {\n Directive,\n DoCheck,\n ElementRef,\n Inject,\n KeyValueDiffers,\n Optional,\n PLATFORM_ID,\n Renderer2,\n SecurityContext,\n Self,\n} from '@angular/core';\nimport {isPlatformServer, NgStyle} from '@angular/common';\nimport {DomSanitizer} from '@angular/platform-browser';\nimport {\n BaseDirective2,\n StyleUtils,\n MediaMarshaller,\n SERVER_TOKEN,\n} from '@angular/flex-layout/core';\n\nimport {\n NgStyleRawList,\n NgStyleType,\n NgStyleSanitizer,\n buildRawList,\n getType,\n buildMapFromSet,\n NgStyleMap,\n NgStyleKeyValue,\n stringToKeyValue,\n keyValuesToMap,\n} from './style-transforms';\n\n@Directive()\nexport class StyleDirective extends BaseDirective2 implements DoCheck {\n\n protected override DIRECTIVE_KEY = 'ngStyle';\n protected fallbackStyles: NgStyleMap;\n protected isServer: boolean;\n\n constructor(elementRef: ElementRef,\n styler: StyleUtils,\n marshal: MediaMarshaller,\n protected sanitizer: DomSanitizer,\n differs: KeyValueDiffers,\n renderer2: Renderer2,\n @Optional() @Self() private readonly ngStyleInstance: NgStyle,\n @Inject(SERVER_TOKEN) serverLoaded: boolean,\n @Inject(PLATFORM_ID) platformId: Object) {\n super(elementRef, null!, styler, marshal);\n if (!this.ngStyleInstance) {\n // Create an instance NgStyle Directive instance only if `ngStyle=\"\"` has NOT been\n // defined on the same host element; since the responsive variations may be defined...\n this.ngStyleInstance = new NgStyle(elementRef, differs, renderer2);\n }\n this.init();\n const styles = this.nativeElement.getAttribute('style') ?? '';\n this.fallbackStyles = this.buildStyleMap(styles);\n this.isServer = serverLoaded && isPlatformServer(platformId);\n }\n\n /** Add generated styles */\n protected override updateWithValue(value: any) {\n const styles = this.buildStyleMap(value);\n this.ngStyleInstance.ngStyle = {...this.fallbackStyles, ...styles};\n if (this.isServer) {\n this.applyStyleToElement(styles);\n }\n this.ngStyleInstance.ngDoCheck();\n }\n\n /** Remove generated styles */\n protected override clearStyles() {\n this.ngStyleInstance.ngStyle = this.fallbackStyles;\n this.ngStyleInstance.ngDoCheck();\n }\n\n /**\n * Convert raw strings to ngStyleMap; which is required by ngStyle\n * NOTE: Raw string key-value pairs MUST be delimited by `;`\n * Comma-delimiters are not supported due to complexities of\n * possible style values such as `rgba(x,x,x,x)` and others\n */\n protected buildStyleMap(styles: NgStyleType): NgStyleMap {\n // Always safe-guard (aka sanitize) style property values\n const sanitizer: NgStyleSanitizer = (val: any) =>\n this.sanitizer.sanitize(SecurityContext.STYLE, val) ?? '';\n if (styles) {\n switch (getType(styles)) {\n case 'string': return buildMapFromList(buildRawList(styles),\n sanitizer);\n case 'array' : return buildMapFromList(styles as NgStyleRawList, sanitizer);\n case 'set' : return buildMapFromSet(styles, sanitizer);\n default : return buildMapFromSet(styles, sanitizer);\n }\n }\n\n return {};\n }\n\n // ******************************************************************\n // Lifecycle Hooks\n // ******************************************************************\n\n /** For ChangeDetectionStrategy.onPush and ngOnChanges() updates */\n ngDoCheck() {\n this.ngStyleInstance.ngDoCheck();\n }\n}\n\nconst inputs = [\n 'ngStyle',\n 'ngStyle.xs', 'ngStyle.sm', 'ngStyle.md', 'ngStyle.lg', 'ngStyle.xl',\n 'ngStyle.lt-sm', 'ngStyle.lt-md', 'ngStyle.lt-lg', 'ngStyle.lt-xl',\n 'ngStyle.gt-xs', 'ngStyle.gt-sm', 'ngStyle.gt-md', 'ngStyle.gt-lg'\n];\n\nconst selector = `\n [ngStyle],\n [ngStyle.xs], [ngStyle.sm], [ngStyle.md], [ngStyle.lg], [ngStyle.xl],\n [ngStyle.lt-sm], [ngStyle.lt-md], [ngStyle.lt-lg], [ngStyle.lt-xl],\n [ngStyle.gt-xs], [ngStyle.gt-sm], [ngStyle.gt-md], [ngStyle.gt-lg]\n`;\n\n/**\n * Directive to add responsive support for ngStyle.\n *\n */\n@Directive({selector, inputs})\nexport class DefaultStyleDirective extends StyleDirective implements DoCheck {\n protected override inputs = inputs;\n}\n\n/** Build a styles map from a list of styles, while sanitizing bad values first */\nfunction buildMapFromList(styles: NgStyleRawList, sanitize?: NgStyleSanitizer): NgStyleMap {\n const sanitizeValue = (it: NgStyleKeyValue) => {\n if (sanitize) {\n it.value = sanitize(it.value);\n }\n return it;\n };\n\n return styles\n .map(stringToKeyValue)\n .filter(entry => !!entry)\n .map(sanitizeValue)\n .reduce(keyValuesToMap, {} as NgStyleMap);\n}\n","/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.io/license\n */\nimport {NgModule} from '@angular/core';\nimport {CoreModule} from '@angular/flex-layout/core';\n\nimport {DefaultImgSrcDirective} from './img-src/img-src';\nimport {DefaultClassDirective} from './class/class';\nimport {DefaultShowHideDirective} from './show-hide/show-hide';\nimport {DefaultStyleDirective} from './style/style';\n\n\nconst ALL_DIRECTIVES = [\n DefaultShowHideDirective,\n DefaultClassDirective,\n DefaultStyleDirective,\n DefaultImgSrcDirective,\n];\n\n/**\n * *****************************************************************\n * Define module for the Extended API\n * *****************************************************************\n */\n\n@NgModule({\n imports: [CoreModule],\n declarations: [...ALL_DIRECTIVES],\n exports: [...ALL_DIRECTIVES]\n})\nexport class ExtendedModule {\n}\n","/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.io/license\n */\n\nexport * from './module';\n\nexport * from './class/class';\nexport * from './img-src/img-src';\nexport * from './show-hide/show-hide';\nexport * from './style/style';\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":["inputs","selector","buildMapFromList","i2","i3"],"mappings":"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"} +\ No newline at end of file ++{"version":3,"file":"angular-flex-layout-extended.mjs","sources":["../../../../projects/libs/flex-layout/extended/img-src/img-src.ts","../../../../projects/libs/flex-layout/extended/class/class.ts","../../../../projects/libs/flex-layout/extended/show-hide/show-hide.ts","../../../../projects/libs/flex-layout/extended/style/style-transforms.ts","../../../../projects/libs/flex-layout/extended/style/style.ts","../../../../projects/libs/flex-layout/extended/module.ts","../../../../projects/libs/flex-layout/extended/public-api.ts","../../../../projects/libs/flex-layout/extended/angular-flex-layout-extended.ts"],"sourcesContent":["/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.io/license\n */\nimport {Directive, ElementRef, Inject, PLATFORM_ID, Injectable, Input} from '@angular/core';\nimport {isPlatformServer} from '@angular/common';\nimport {\n MediaMarshaller,\n BaseDirective2,\n SERVER_TOKEN,\n StyleBuilder,\n StyleDefinition,\n StyleUtils,\n} from '@angular/flex-layout/core';\n\n@Injectable({providedIn: 'root'})\nexport class ImgSrcStyleBuilder extends StyleBuilder {\n buildStyles(url: string) {\n return {'content': url ? `url(${url})` : ''};\n }\n}\n\n@Directive()\nexport class ImgSrcDirective extends BaseDirective2 {\n protected override DIRECTIVE_KEY = 'img-src';\n protected defaultSrc = '';\n\n @Input('src')\n set src(val: string) {\n this.defaultSrc = val;\n this.setValue(this.defaultSrc, '');\n }\n\n constructor(elementRef: ElementRef,\n styleBuilder: ImgSrcStyleBuilder,\n styler: StyleUtils,\n marshal: MediaMarshaller,\n @Inject(PLATFORM_ID) protected platformId: Object,\n @Inject(SERVER_TOKEN) protected serverModuleLoaded: boolean) {\n super(elementRef, styleBuilder, styler, marshal);\n this.init();\n this.setValue(this.nativeElement.getAttribute('src') || '', '');\n if (isPlatformServer(this.platformId) && this.serverModuleLoaded) {\n this.nativeElement.setAttribute('src', '');\n }\n }\n\n /**\n * Use the [responsively] activated input value to update\n * the host img src attribute or assign a default `img.src=''`\n * if the src has not been defined.\n *\n * Do nothing to standard `` usages, only when responsive\n * keys are present do we actually call `setAttribute()`\n */\n protected override updateWithValue(value?: string) {\n const url = value || this.defaultSrc;\n if (isPlatformServer(this.platformId) && this.serverModuleLoaded) {\n this.addStyles(url);\n } else {\n this.nativeElement.setAttribute('src', url);\n }\n }\n\n protected override styleCache = imgSrcCache;\n}\n\nconst imgSrcCache: Map = new Map();\n\nconst inputs = [\n 'src.xs', 'src.sm', 'src.md', 'src.lg', 'src.xl',\n 'src.lt-sm', 'src.lt-md', 'src.lt-lg', 'src.lt-xl',\n 'src.gt-xs', 'src.gt-sm', 'src.gt-md', 'src.gt-lg'\n];\n\nconst selector = `\n img[src.xs], img[src.sm], img[src.md], img[src.lg], img[src.xl],\n img[src.lt-sm], img[src.lt-md], img[src.lt-lg], img[src.lt-xl],\n img[src.gt-xs], img[src.gt-sm], img[src.gt-md], img[src.gt-lg]\n`;\n\n/**\n * This directive provides a responsive API for the HTML 'src' attribute\n * and will update the img.src property upon each responsive activation.\n *\n * e.g.\n * \n *\n * @see https://css-tricks.com/responsive-images-youre-just-changing-resolutions-use-src/\n */\n@Directive({selector, inputs})\nexport class DefaultImgSrcDirective extends ImgSrcDirective {\n protected override inputs = inputs;\n}\n","/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.io/license\n */\nimport {\n Directive,\n DoCheck,\n ElementRef,\n Input,\n IterableDiffers,\n KeyValueDiffers,\n Optional,\n Renderer2,\n Self,\n} from '@angular/core';\nimport {NgClass} from '@angular/common';\nimport {BaseDirective2, StyleUtils, MediaMarshaller} from '@angular/flex-layout/core';\n\n@Directive()\nexport class ClassDirective extends BaseDirective2 implements DoCheck {\n\n protected override DIRECTIVE_KEY = 'ngClass';\n\n /**\n * Capture class assignments so we cache the default classes\n * which are merged with activated styles and used as fallbacks.\n */\n @Input('class')\n set klass(val: string) {\n this.ngClassInstance.klass = val;\n this.setValue(val, '');\n }\n\n constructor(elementRef: ElementRef,\n styler: StyleUtils,\n marshal: MediaMarshaller,\n iterableDiffers: IterableDiffers,\n keyValueDiffers: KeyValueDiffers,\n renderer2: Renderer2,\n @Optional() @Self() protected readonly ngClassInstance: NgClass) {\n super(elementRef, null!, styler, marshal);\n if (!this.ngClassInstance) {\n // Create an instance NgClass Directive instance only if `ngClass=\"\"` has NOT been defined on\n // the same host element; since the responsive variations may be defined...\n this.ngClassInstance = new NgClass(elementRef, renderer2);\n }\n this.init();\n this.setValue('', '');\n }\n\n protected override updateWithValue(value: any) {\n this.ngClassInstance.ngClass = value;\n this.ngClassInstance.ngDoCheck();\n }\n\n // ******************************************************************\n // Lifecycle Hooks\n // ******************************************************************\n\n /**\n * For ChangeDetectionStrategy.onPush and ngOnChanges() updates\n */\n ngDoCheck() {\n this.ngClassInstance.ngDoCheck();\n }\n}\n\nconst inputs = [\n 'ngClass', 'ngClass.xs', 'ngClass.sm', 'ngClass.md', 'ngClass.lg', 'ngClass.xl',\n 'ngClass.lt-sm', 'ngClass.lt-md', 'ngClass.lt-lg', 'ngClass.lt-xl',\n 'ngClass.gt-xs', 'ngClass.gt-sm', 'ngClass.gt-md', 'ngClass.gt-lg'\n];\n\nconst selector = `\n [ngClass], [ngClass.xs], [ngClass.sm], [ngClass.md], [ngClass.lg], [ngClass.xl],\n [ngClass.lt-sm], [ngClass.lt-md], [ngClass.lt-lg], [ngClass.lt-xl],\n [ngClass.gt-xs], [ngClass.gt-sm], [ngClass.gt-md], [ngClass.gt-lg]\n`;\n\n/**\n * Directive to add responsive support for ngClass.\n * This maintains the core functionality of 'ngClass' and adds responsive API\n * Note: this class is a no-op when rendered on the server\n */\n@Directive({selector, inputs})\nexport class DefaultClassDirective extends ClassDirective {\n protected override inputs = inputs;\n}\n","/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.io/license\n */\nimport {\n Directive,\n ElementRef,\n OnChanges,\n SimpleChanges,\n Inject,\n PLATFORM_ID,\n Injectable,\n AfterViewInit,\n} from '@angular/core';\nimport {isPlatformServer} from '@angular/common';\nimport {\n BaseDirective2,\n LAYOUT_CONFIG,\n LayoutConfigOptions,\n MediaMarshaller,\n SERVER_TOKEN,\n StyleUtils,\n StyleBuilder,\n} from '@angular/flex-layout/core';\nimport {coerceBooleanProperty} from '@angular/cdk/coercion';\nimport {takeUntil} from 'rxjs/operators';\n\nexport interface ShowHideParent {\n display: string;\n isServer: boolean;\n}\n\n@Injectable({providedIn: 'root'})\nexport class ShowHideStyleBuilder extends StyleBuilder {\n buildStyles(show: string, parent: ShowHideParent) {\n const shouldShow = show === 'true';\n return {'display': shouldShow ? parent.display || (parent.isServer ? 'initial' : '') : 'none'};\n }\n}\n\n@Directive()\nexport class ShowHideDirective extends BaseDirective2 implements AfterViewInit, OnChanges {\n protected override DIRECTIVE_KEY = 'show-hide';\n\n /** Original DOM Element CSS display style */\n protected display: string = '';\n protected hasLayout = false;\n protected hasFlexChild = false;\n\n constructor(elementRef: ElementRef,\n styleBuilder: ShowHideStyleBuilder,\n styler: StyleUtils,\n marshal: MediaMarshaller,\n @Inject(LAYOUT_CONFIG) protected layoutConfig: LayoutConfigOptions,\n @Inject(PLATFORM_ID) protected platformId: Object,\n @Inject(SERVER_TOKEN) protected serverModuleLoaded: boolean) {\n super(elementRef, styleBuilder, styler, marshal);\n }\n\n // *********************************************\n // Lifecycle Methods\n // *********************************************\n\n ngAfterViewInit() {\n this.trackExtraTriggers();\n\n const children = Array.from(this.nativeElement.children);\n for (let i = 0; i < children.length; i++) {\n if (this.marshal.hasValue(children[i] as HTMLElement, 'flex')) {\n this.hasFlexChild = true;\n break;\n }\n }\n\n if (DISPLAY_MAP.has(this.nativeElement)) {\n this.display = DISPLAY_MAP.get(this.nativeElement)!;\n } else {\n this.display = this.getDisplayStyle();\n DISPLAY_MAP.set(this.nativeElement, this.display);\n }\n\n this.init();\n // set the default to show unless explicitly overridden\n const defaultValue = this.marshal.getValue(this.nativeElement, this.DIRECTIVE_KEY, '');\n if (defaultValue === undefined || defaultValue === '') {\n this.setValue(true, '');\n } else {\n this.triggerUpdate();\n }\n }\n\n /**\n * On changes to any @Input properties...\n * Default to use the non-responsive Input value ('fxShow')\n * Then conditionally override with the mq-activated Input's current value\n */\n override ngOnChanges(changes: SimpleChanges) {\n Object.keys(changes).forEach(key => {\n if (this.inputs.indexOf(key) !== -1) {\n const inputKey = key.split('.');\n const bp = inputKey.slice(1).join('.');\n const inputValue = changes[key].currentValue;\n let shouldShow = inputValue !== '' ?\n inputValue !== 0 ? coerceBooleanProperty(inputValue) : false\n : true;\n if (inputKey[0] === 'fxHide') {\n shouldShow = !shouldShow;\n }\n this.setValue(shouldShow, bp);\n }\n });\n }\n\n // *********************************************\n // Protected methods\n // *********************************************\n\n /**\n * Watch for these extra triggers to update fxShow, fxHide stylings\n */\n protected trackExtraTriggers() {\n this.hasLayout = this.marshal.hasValue(this.nativeElement, 'layout');\n\n ['layout', 'layout-align'].forEach(key => {\n this.marshal\n .trackValue(this.nativeElement, key)\n .pipe(takeUntil(this.destroySubject))\n .subscribe(this.triggerUpdate.bind(this));\n });\n }\n\n /**\n * Override accessor to the current HTMLElement's `display` style\n * Note: Show/Hide will not change the display to 'flex' but will set it to 'block'\n * unless it was already explicitly specified inline or in a CSS stylesheet.\n */\n protected getDisplayStyle(): string {\n return (this.hasLayout || (this.hasFlexChild && this.layoutConfig.addFlexToParent)) ?\n 'flex' : this.styler.lookupStyle(this.nativeElement, 'display', true);\n }\n\n /** Validate the visibility value and then update the host's inline display style */\n protected override updateWithValue(value: boolean | string = true) {\n if (value === '') {\n return;\n }\n const isServer = isPlatformServer(this.platformId);\n this.addStyles(value ? 'true' : 'false', {display: this.display, isServer});\n if (isServer && this.serverModuleLoaded) {\n this.nativeElement.style.setProperty('display', '');\n }\n this.marshal.triggerUpdate(this.parentElement!, 'layout-gap');\n }\n}\n\nconst DISPLAY_MAP: WeakMap = new WeakMap();\n\nconst inputs = [\n 'fxShow', 'fxShow.print',\n 'fxShow.xs', 'fxShow.sm', 'fxShow.md', 'fxShow.lg', 'fxShow.xl',\n 'fxShow.lt-sm', 'fxShow.lt-md', 'fxShow.lt-lg', 'fxShow.lt-xl',\n 'fxShow.gt-xs', 'fxShow.gt-sm', 'fxShow.gt-md', 'fxShow.gt-lg',\n 'fxHide', 'fxHide.print',\n 'fxHide.xs', 'fxHide.sm', 'fxHide.md', 'fxHide.lg', 'fxHide.xl',\n 'fxHide.lt-sm', 'fxHide.lt-md', 'fxHide.lt-lg', 'fxHide.lt-xl',\n 'fxHide.gt-xs', 'fxHide.gt-sm', 'fxHide.gt-md', 'fxHide.gt-lg'\n];\n\nconst selector = `\n [fxShow], [fxShow.print],\n [fxShow.xs], [fxShow.sm], [fxShow.md], [fxShow.lg], [fxShow.xl],\n [fxShow.lt-sm], [fxShow.lt-md], [fxShow.lt-lg], [fxShow.lt-xl],\n [fxShow.gt-xs], [fxShow.gt-sm], [fxShow.gt-md], [fxShow.gt-lg],\n [fxHide], [fxHide.print],\n [fxHide.xs], [fxHide.sm], [fxHide.md], [fxHide.lg], [fxHide.xl],\n [fxHide.lt-sm], [fxHide.lt-md], [fxHide.lt-lg], [fxHide.lt-xl],\n [fxHide.gt-xs], [fxHide.gt-sm], [fxHide.gt-md], [fxHide.gt-lg]\n`;\n\n/**\n * 'show' Layout API directive\n */\n@Directive({selector, inputs})\nexport class DefaultShowHideDirective extends ShowHideDirective {\n protected override inputs = inputs;\n}\n","/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.io/license\n */\n\nexport type NgStyleRawList = string[];\nexport type NgStyleMap = {[klass: string]: string};\n// NgStyle selectors accept NgStyleType values\nexport type NgStyleType = string | Set | NgStyleRawList | NgStyleMap;\n\n/**\n * Callback function for SecurityContext.STYLE sanitization\n */\nexport type NgStyleSanitizer = (val: any) => string;\n\n/** NgStyle allowed inputs */\nexport class NgStyleKeyValue {\n constructor(public key: string, public value: string, noQuotes = true) {\n this.key = noQuotes ? key.replace(/['\"]/g, '').trim() : key.trim();\n\n this.value = noQuotes ? value.replace(/['\"]/g, '').trim() : value.trim();\n this.value = this.value.replace(/;/, '');\n }\n}\n\nexport function getType(target: any): string {\n let what = typeof target;\n if (what === 'object') {\n return (target.constructor === Array) ? 'array' :\n (target.constructor === Set) ? 'set' : 'object';\n }\n return what;\n}\n\n/**\n * Split string of key:value pairs into Array of k-v pairs\n * e.g. 'key:value; key:value; key:value;' -> ['key:value',...]\n */\nexport function buildRawList(source: any, delimiter = ';'): NgStyleRawList {\n return String(source)\n .trim()\n .split(delimiter)\n .map((val: string) => val.trim())\n .filter(val => val !== '');\n}\n\n/** Convert array of key:value strings to a iterable map object */\nexport function buildMapFromList(styles: NgStyleRawList, sanitize?: NgStyleSanitizer): NgStyleMap {\n const sanitizeValue = (it: NgStyleKeyValue) => {\n if (sanitize) {\n it.value = sanitize(it.value);\n }\n return it;\n };\n\n return styles\n .map(stringToKeyValue)\n .filter(entry => !!entry)\n .map(sanitizeValue)\n .reduce(keyValuesToMap, {} as NgStyleMap);\n}\n\n/** Convert Set or raw Object to an iterable NgStyleMap */\nexport function buildMapFromSet(source: NgStyleType, sanitize?: NgStyleSanitizer): NgStyleMap {\n let list: string[] = [];\n if (getType(source) === 'set') {\n (source as Set).forEach(entry => list.push(entry));\n } else {\n Object.keys(source).forEach((key: string) => {\n list.push(`${key}:${(source as NgStyleMap)[key]}`);\n });\n }\n return buildMapFromList(list, sanitize);\n}\n\n\n/** Convert 'key:value' -> [key, value] */\nexport function stringToKeyValue(it: string): NgStyleKeyValue {\n const [key, ...vals] = it.split(':');\n return new NgStyleKeyValue(key, vals.join(':'));\n}\n\n/** Convert [ [key,value] ] -> { key : value } */\nexport function keyValuesToMap(map: NgStyleMap, entry: NgStyleKeyValue): NgStyleMap {\n if (!!entry.key) {\n map[entry.key] = entry.value;\n }\n return map;\n}\n","/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.io/license\n */\nimport {\n Directive,\n DoCheck,\n ElementRef,\n Inject,\n KeyValueDiffers,\n Optional,\n PLATFORM_ID,\n Renderer2,\n SecurityContext,\n Self,\n} from '@angular/core';\nimport {isPlatformServer, NgStyle} from '@angular/common';\nimport {DomSanitizer} from '@angular/platform-browser';\nimport {\n BaseDirective2,\n StyleUtils,\n MediaMarshaller,\n SERVER_TOKEN,\n} from '@angular/flex-layout/core';\n\nimport {\n NgStyleRawList,\n NgStyleType,\n NgStyleSanitizer,\n buildRawList,\n getType,\n buildMapFromSet,\n NgStyleMap,\n NgStyleKeyValue,\n stringToKeyValue,\n keyValuesToMap,\n} from './style-transforms';\n\n@Directive()\nexport class StyleDirective extends BaseDirective2 implements DoCheck {\n\n protected override DIRECTIVE_KEY = 'ngStyle';\n protected fallbackStyles: NgStyleMap;\n protected isServer: boolean;\n\n constructor(elementRef: ElementRef,\n styler: StyleUtils,\n marshal: MediaMarshaller,\n protected sanitizer: DomSanitizer,\n differs: KeyValueDiffers,\n renderer2: Renderer2,\n @Optional() @Self() private readonly ngStyleInstance: NgStyle,\n @Inject(SERVER_TOKEN) serverLoaded: boolean,\n @Inject(PLATFORM_ID) platformId: Object) {\n super(elementRef, null!, styler, marshal);\n if (!this.ngStyleInstance) {\n // Create an instance NgStyle Directive instance only if `ngStyle=\"\"` has NOT been\n // defined on the same host element; since the responsive variations may be defined...\n this.ngStyleInstance = new NgStyle(elementRef, differs, renderer2);\n }\n this.init();\n const styles = this.nativeElement.getAttribute('style') ?? '';\n this.fallbackStyles = this.buildStyleMap(styles);\n this.isServer = serverLoaded && isPlatformServer(platformId);\n }\n\n /** Add generated styles */\n protected override updateWithValue(value: any) {\n const styles = this.buildStyleMap(value);\n this.ngStyleInstance.ngStyle = {...this.fallbackStyles, ...styles};\n if (this.isServer) {\n this.applyStyleToElement(styles);\n }\n this.ngStyleInstance.ngDoCheck();\n }\n\n /** Remove generated styles */\n protected override clearStyles() {\n this.ngStyleInstance.ngStyle = this.fallbackStyles;\n this.ngStyleInstance.ngDoCheck();\n }\n\n /**\n * Convert raw strings to ngStyleMap; which is required by ngStyle\n * NOTE: Raw string key-value pairs MUST be delimited by `;`\n * Comma-delimiters are not supported due to complexities of\n * possible style values such as `rgba(x,x,x,x)` and others\n */\n protected buildStyleMap(styles: NgStyleType): NgStyleMap {\n // Always safe-guard (aka sanitize) style property values\n const sanitizer: NgStyleSanitizer = (val: any) =>\n this.sanitizer.sanitize(SecurityContext.STYLE, val) ?? '';\n if (styles) {\n switch (getType(styles)) {\n case 'string': return buildMapFromList(buildRawList(styles),\n sanitizer);\n case 'array' : return buildMapFromList(styles as NgStyleRawList, sanitizer);\n case 'set' : return buildMapFromSet(styles, sanitizer);\n default : return buildMapFromSet(styles, sanitizer);\n }\n }\n\n return {};\n }\n\n // ******************************************************************\n // Lifecycle Hooks\n // ******************************************************************\n\n /** For ChangeDetectionStrategy.onPush and ngOnChanges() updates */\n ngDoCheck() {\n this.ngStyleInstance.ngDoCheck();\n }\n}\n\nconst inputs = [\n 'ngStyle',\n 'ngStyle.xs', 'ngStyle.sm', 'ngStyle.md', 'ngStyle.lg', 'ngStyle.xl',\n 'ngStyle.lt-sm', 'ngStyle.lt-md', 'ngStyle.lt-lg', 'ngStyle.lt-xl',\n 'ngStyle.gt-xs', 'ngStyle.gt-sm', 'ngStyle.gt-md', 'ngStyle.gt-lg'\n];\n\nconst selector = `\n [ngStyle],\n [ngStyle.xs], [ngStyle.sm], [ngStyle.md], [ngStyle.lg], [ngStyle.xl],\n [ngStyle.lt-sm], [ngStyle.lt-md], [ngStyle.lt-lg], [ngStyle.lt-xl],\n [ngStyle.gt-xs], [ngStyle.gt-sm], [ngStyle.gt-md], [ngStyle.gt-lg]\n`;\n\n/**\n * Directive to add responsive support for ngStyle.\n *\n */\n@Directive({selector, inputs})\nexport class DefaultStyleDirective extends StyleDirective implements DoCheck {\n protected override inputs = inputs;\n}\n\n/** Build a styles map from a list of styles, while sanitizing bad values first */\nfunction buildMapFromList(styles: NgStyleRawList, sanitize?: NgStyleSanitizer): NgStyleMap {\n const sanitizeValue = (it: NgStyleKeyValue) => {\n if (sanitize) {\n it.value = sanitize(it.value);\n }\n return it;\n };\n\n return styles\n .map(stringToKeyValue)\n .filter(entry => !!entry)\n .map(sanitizeValue)\n .reduce(keyValuesToMap, {} as NgStyleMap);\n}\n","/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.io/license\n */\nimport {NgModule} from '@angular/core';\nimport {CoreModule} from '@angular/flex-layout/core';\n\nimport {DefaultImgSrcDirective} from './img-src/img-src';\nimport {DefaultClassDirective} from './class/class';\nimport {DefaultShowHideDirective} from './show-hide/show-hide';\nimport {DefaultStyleDirective} from './style/style';\n\n\nconst ALL_DIRECTIVES = [\n DefaultShowHideDirective,\n DefaultClassDirective,\n DefaultStyleDirective,\n DefaultImgSrcDirective,\n];\n\n/**\n * *****************************************************************\n * Define module for the Extended API\n * *****************************************************************\n */\n\n@NgModule({\n imports: [CoreModule],\n declarations: [...ALL_DIRECTIVES],\n exports: [...ALL_DIRECTIVES]\n})\nexport class ExtendedModule {\n}\n","/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.io/license\n */\n\nexport * from './module';\n\nexport * from './class/class';\nexport * from './img-src/img-src';\nexport * from './show-hide/show-hide';\nexport * from './style/style';\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":["inputs","selector","buildMapFromList","i2","i3"],"mappings":"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"} diff --git a/ui-ngx/patches/@mat-datetimepicker+core+11.0.3.patch b/ui-ngx/patches/@mat-datetimepicker+core+11.0.3.patch deleted file mode 100644 index 990754ef1a..0000000000 --- a/ui-ngx/patches/@mat-datetimepicker+core+11.0.3.patch +++ /dev/null @@ -1,51 +0,0 @@ -diff --git a/node_modules/@mat-datetimepicker/core/esm2020/datetimepicker/clock.mjs b/node_modules/@mat-datetimepicker/core/esm2020/datetimepicker/clock.mjs -index e3457ea..a069460 100644 ---- a/node_modules/@mat-datetimepicker/core/esm2020/datetimepicker/clock.mjs -+++ b/node_modules/@mat-datetimepicker/core/esm2020/datetimepicker/clock.mjs -@@ -259,9 +259,9 @@ export class MatDatetimepickerClockComponent { - value = 0; - } - // Don't close the minutes view if an invalid minute is clicked. -- if (!this._minutes.find((m) => m?.['value'] === value)?.['enabled']) { -- return; -- } -+ // if (!this._minutes.find((m) => m?.['value'] === value)?.['enabled']) { -+ // return; -+ // } - date = this._adapter.createDatetime(this._adapter.getYear(this.activeDate), this._adapter.getMonth(this.activeDate), this._adapter.getDate(this.activeDate), this._adapter.getHour(this.activeDate), value); - } - this._timeChanged = true; -diff --git a/node_modules/@mat-datetimepicker/core/fesm2015/mat-datetimepicker-core.mjs b/node_modules/@mat-datetimepicker/core/fesm2015/mat-datetimepicker-core.mjs -index 7699ff6..01aad13 100644 ---- a/node_modules/@mat-datetimepicker/core/fesm2015/mat-datetimepicker-core.mjs -+++ b/node_modules/@mat-datetimepicker/core/fesm2015/mat-datetimepicker-core.mjs -@@ -951,9 +951,9 @@ class MatDatetimepickerClockComponent { - value = 0; - } - // Don't close the minutes view if an invalid minute is clicked. -- if (!((_b = this._minutes.find((m) => (m === null || m === void 0 ? void 0 : m['value']) === value)) === null || _b === void 0 ? void 0 : _b['enabled'])) { -- return; -- } -+ // if (!((_b = this._minutes.find((m) => (m === null || m === void 0 ? void 0 : m['value']) === value)) === null || _b === void 0 ? void 0 : _b['enabled'])) { -+ // return; -+ // } - date = this._adapter.createDatetime(this._adapter.getYear(this.activeDate), this._adapter.getMonth(this.activeDate), this._adapter.getDate(this.activeDate), this._adapter.getHour(this.activeDate), value); - } - this._timeChanged = true; -diff --git a/node_modules/@mat-datetimepicker/core/fesm2020/mat-datetimepicker-core.mjs b/node_modules/@mat-datetimepicker/core/fesm2020/mat-datetimepicker-core.mjs -index 809a57d..f712b84 100644 ---- a/node_modules/@mat-datetimepicker/core/fesm2020/mat-datetimepicker-core.mjs -+++ b/node_modules/@mat-datetimepicker/core/fesm2020/mat-datetimepicker-core.mjs -@@ -946,9 +946,9 @@ class MatDatetimepickerClockComponent { - value = 0; - } - // Don't close the minutes view if an invalid minute is clicked. -- if (!this._minutes.find((m) => m?.['value'] === value)?.['enabled']) { -- return; -- } -+ // if (!this._minutes.find((m) => m?.['value'] === value)?.['enabled']) { -+ // return; -+ // } - date = this._adapter.createDatetime(this._adapter.getYear(this.activeDate), this._adapter.getMonth(this.activeDate), this._adapter.getDate(this.activeDate), this._adapter.getHour(this.activeDate), value); - } - this._timeChanged = true; diff --git a/ui-ngx/patches/@mat-datetimepicker+core+14.0.0.patch b/ui-ngx/patches/@mat-datetimepicker+core+14.0.0.patch new file mode 100644 index 0000000000..293ac10a21 --- /dev/null +++ b/ui-ngx/patches/@mat-datetimepicker+core+14.0.0.patch @@ -0,0 +1,34 @@ +diff --git a/node_modules/@mat-datetimepicker/core/esm2022/datetimepicker/clock.mjs b/node_modules/@mat-datetimepicker/core/esm2022/datetimepicker/clock.mjs +index 7ecfae7..08363d3 100644 +--- a/node_modules/@mat-datetimepicker/core/esm2022/datetimepicker/clock.mjs ++++ b/node_modules/@mat-datetimepicker/core/esm2022/datetimepicker/clock.mjs +@@ -259,9 +259,9 @@ export class MatDatetimepickerClockComponent { + value = 0; + } + // Don't close the minutes view if an invalid minute is clicked. +- if (!this._minutes.find((m) => m?.['value'] === value)?.['enabled']) { +- return; +- } ++ // if (!this._minutes.find((m) => m?.['value'] === value)?.['enabled']) { ++ // return; ++ // } + date = this._adapter.createDatetime(this._adapter.getYear(this.activeDate), this._adapter.getMonth(this.activeDate), this._adapter.getDate(this.activeDate), this._adapter.getHour(this.activeDate), value); + } + this._timeChanged = true; +diff --git a/node_modules/@mat-datetimepicker/core/fesm2022/mat-datetimepicker-core.mjs b/node_modules/@mat-datetimepicker/core/fesm2022/mat-datetimepicker-core.mjs +index 00f4a52..df688e3 100644 +--- a/node_modules/@mat-datetimepicker/core/fesm2022/mat-datetimepicker-core.mjs ++++ b/node_modules/@mat-datetimepicker/core/fesm2022/mat-datetimepicker-core.mjs +@@ -946,9 +946,9 @@ class MatDatetimepickerClockComponent { + value = 0; + } + // Don't close the minutes view if an invalid minute is clicked. +- if (!this._minutes.find((m) => m?.['value'] === value)?.['enabled']) { +- return; +- } ++ // if (!this._minutes.find((m) => m?.['value'] === value)?.['enabled']) { ++ // return; ++ // } + date = this._adapter.createDatetime(this._adapter.getYear(this.activeDate), this._adapter.getMonth(this.activeDate), this._adapter.getDate(this.activeDate), this._adapter.getHour(this.activeDate), value); + } + this._timeChanged = true; diff --git a/ui-ngx/patches/angular-gridster2+15.0.4.patch b/ui-ngx/patches/angular-gridster2+18.0.1.patch similarity index 69% rename from ui-ngx/patches/angular-gridster2+15.0.4.patch rename to ui-ngx/patches/angular-gridster2+18.0.1.patch index df511350c5..b8f51f39f8 100644 --- a/ui-ngx/patches/angular-gridster2+15.0.4.patch +++ b/ui-ngx/patches/angular-gridster2+18.0.1.patch @@ -1,15 +1,15 @@ -diff --git a/node_modules/angular-gridster2/fesm2020/angular-gridster2.mjs b/node_modules/angular-gridster2/fesm2020/angular-gridster2.mjs -index cf4e220..df51c91 100644 ---- a/node_modules/angular-gridster2/fesm2020/angular-gridster2.mjs -+++ b/node_modules/angular-gridster2/fesm2020/angular-gridster2.mjs +diff --git a/node_modules/angular-gridster2/fesm2022/angular-gridster2.mjs b/node_modules/angular-gridster2/fesm2022/angular-gridster2.mjs +index 0dcd873..e99b602 100644 +--- a/node_modules/angular-gridster2/fesm2022/angular-gridster2.mjs ++++ b/node_modules/angular-gridster2/fesm2022/angular-gridster2.mjs @@ -666,8 +666,8 @@ class GridsterRenderer { - renderer.setStyle(el, DirTypes.LTR ? 'margin-right' : 'margin-left', ''); - } - else { -- const x = Math.round(this.gridster.curColWidth * item.x); -- const y = Math.round(this.gridster.curRowHeight * item.y); -+ const x = this.gridster.curColWidth * item.x; -+ const y = this.gridster.curRowHeight * item.y; - const width = this.gridster.curColWidth * item.cols - this.gridster.$options.margin; - const height = this.gridster.curRowHeight * item.rows - this.gridster.$options.margin; - // set the cell style + renderer.setStyle(el, DirTypes.LTR ? 'margin-right' : 'margin-left', ''); + } + else { +- const x = Math.round(this.gridster.curColWidth * item.x); +- const y = Math.round(this.gridster.curRowHeight * item.y); ++ const x = this.gridster.curColWidth * item.x; ++ const y = this.gridster.curRowHeight * item.y; + const width = this.gridster.curColWidth * item.cols - this.gridster.$options.margin; + const height = this.gridster.curRowHeight * item.rows - this.gridster.$options.margin; + // set the cell style diff --git a/ui-ngx/pom.xml b/ui-ngx/pom.xml index feed11c479..52d1583357 100644 --- a/ui-ngx/pom.xml +++ b/ui-ngx/pom.xml @@ -57,7 +57,7 @@ v20.11.1 - v1.22.17 + v1.22.22 diff --git a/ui-ngx/src/app/core/api/widget-api.models.ts b/ui-ngx/src/app/core/api/widget-api.models.ts index bca6a05644..82ac4e299c 100644 --- a/ui-ngx/src/app/core/api/widget-api.models.ts +++ b/ui-ngx/src/app/core/api/widget-api.models.ts @@ -42,7 +42,6 @@ import { RafService } from '@core/services/raf.service'; import { EntityAliases } from '@shared/models/alias.models'; import { EntityInfo } from '@app/shared/models/entity.models'; import { IDashboardComponent } from '@home/models/dashboard-component.models'; -import moment_ from 'moment'; import { AlarmData, AlarmDataPageLink, diff --git a/ui-ngx/src/app/core/core.module.ts b/ui-ngx/src/app/core/core.module.ts index 4b3fb44b12..a8e2ccbe02 100644 --- a/ui-ngx/src/app/core/core.module.ts +++ b/ui-ngx/src/app/core/core.module.ts @@ -15,8 +15,8 @@ /// import { NgModule } from '@angular/core'; -import { CommonModule } from '@angular/common'; -import { HTTP_INTERCEPTORS, HttpClientModule } from '@angular/common/http'; +import { CommonModule, IMAGE_CONFIG } from '@angular/common'; +import { HTTP_INTERCEPTORS, provideHttpClient, withInterceptorsFromDi } from '@angular/common/http'; import { StoreModule } from '@ngrx/store'; import { EffectsModule } from '@ngrx/effects'; import { StoreDevtoolsModule } from '@ngrx/store-devtools'; @@ -43,74 +43,72 @@ import { TranslateDefaultParser } from '@core/translate/translate-default-parser import { TranslateDefaultLoader } from '@core/translate/translate-default-loader'; import { EntityConflictInterceptor } from '@core/interceptors/entity-conflict.interceptor'; -@NgModule({ - imports: [ - CommonModule, - HttpClientModule, - FlexLayoutModule.withConfig({addFlexToParent: false}), - MatDialogModule, - MatButtonModule, - MatSnackBarModule, - - // ngx-translate - TranslateModule.forRoot({ - loader: { - provide: TranslateLoader, - useClass: TranslateDefaultLoader - }, - missingTranslationHandler: { - provide: MissingTranslationHandler, - useClass: TbMissingTranslationHandler - }, - compiler: { - provide: TranslateCompiler, - useClass: TranslateDefaultCompiler - }, - parser: { - provide: TranslateParser, - useClass: TranslateDefaultParser - } - }), - HotkeyModule.forRoot(), - - // ngrx - StoreModule.forRoot(reducers, - { metaReducers, - runtimeChecks: { - strictStateImmutability: true, - strictActionImmutability: true, - strictStateSerializability: true, - strictActionSerializability: true - }} - ), - EffectsModule.forRoot(effects), - env.production - ? [] - : StoreDevtoolsModule.instrument({ - name: env.appTitle - }) - ], - providers: [ - { - provide: HTTP_INTERCEPTORS, - useClass: GlobalHttpInterceptor, - multi: true - }, - { - provide: HTTP_INTERCEPTORS, - useClass: EntityConflictInterceptor, - multi: true - }, - { - provide: MAT_DIALOG_DEFAULT_OPTIONS, - useValue: { - ...new MatDialogConfig(), - restoreFocus: false - } - }, - WINDOW_PROVIDERS - ], - exports: [] -}) +@NgModule({ exports: [], imports: [CommonModule, + FlexLayoutModule.withConfig({ addFlexToParent: false }), + MatDialogModule, + MatButtonModule, + MatSnackBarModule, + // ngx-translate + TranslateModule.forRoot({ + loader: { + provide: TranslateLoader, + useClass: TranslateDefaultLoader + }, + missingTranslationHandler: { + provide: MissingTranslationHandler, + useClass: TbMissingTranslationHandler + }, + compiler: { + provide: TranslateCompiler, + useClass: TranslateDefaultCompiler + }, + parser: { + provide: TranslateParser, + useClass: TranslateDefaultParser + } + }), + HotkeyModule.forRoot(), + // ngrx + StoreModule.forRoot(reducers, { metaReducers, + runtimeChecks: { + strictStateImmutability: true, + strictActionImmutability: true, + strictStateSerializability: true, + strictActionSerializability: true + } }), + EffectsModule.forRoot(effects), + env.production + ? [] + : StoreDevtoolsModule.instrument({ + name: env.appTitle, + connectInZone: true + })], providers: [ + { + provide: HTTP_INTERCEPTORS, + useClass: GlobalHttpInterceptor, + multi: true + }, + { + provide: HTTP_INTERCEPTORS, + useClass: EntityConflictInterceptor, + multi: true + }, + { + provide: MAT_DIALOG_DEFAULT_OPTIONS, + useValue: { + ...new MatDialogConfig(), + restoreFocus: false + } + }, + WINDOW_PROVIDERS, + provideHttpClient(withInterceptorsFromDi()), + { + provide: IMAGE_CONFIG, + useValue: { + disableImageSizeWarning: true, + disableImageLazyLoadWarning: true + } + } + ] }) export class CoreModule { } diff --git a/ui-ngx/src/app/core/guards/auth.guard.ts b/ui-ngx/src/app/core/guards/auth.guard.ts index 7970f21b05..49408975de 100644 --- a/ui-ngx/src/app/core/guards/auth.guard.ts +++ b/ui-ngx/src/app/core/guards/auth.guard.ts @@ -15,7 +15,7 @@ /// import { Injectable, NgZone } from '@angular/core'; -import { ActivatedRouteSnapshot, CanActivate, CanActivateChild, Router, RouterStateSnapshot } from '@angular/router'; +import { ActivatedRouteSnapshot, Router, RouterStateSnapshot } from '@angular/router'; import { AuthService } from '../auth/auth.service'; import { select, Store } from '@ngrx/store'; import { AppState } from '../core.state'; @@ -34,7 +34,7 @@ import { MobileService } from '@core/services/mobile.service'; @Injectable({ providedIn: 'root' }) -export class AuthGuard implements CanActivate, CanActivateChild { +export class AuthGuard { constructor(private store: Store, private router: Router, diff --git a/ui-ngx/src/app/core/guards/confirm-on-exit.guard.ts b/ui-ngx/src/app/core/guards/confirm-on-exit.guard.ts index e7d2aababc..a9401dfb03 100644 --- a/ui-ngx/src/app/core/guards/confirm-on-exit.guard.ts +++ b/ui-ngx/src/app/core/guards/confirm-on-exit.guard.ts @@ -15,7 +15,7 @@ /// import { Injectable } from '@angular/core'; -import { ActivatedRouteSnapshot, CanDeactivate, RouterStateSnapshot } from '@angular/router'; +import { ActivatedRouteSnapshot, RouterStateSnapshot } from '@angular/router'; import { UntypedFormGroup } from '@angular/forms'; import { select, Store } from '@ngrx/store'; import { AppState } from '@core/core.state'; @@ -39,7 +39,7 @@ export interface HasDirtyFlag { @Injectable({ providedIn: 'root' }) -export class ConfirmOnExitGuard implements CanDeactivate { +export class ConfirmOnExitGuard { constructor(private store: Store, private dialogService: DialogService, diff --git a/ui-ngx/src/app/core/http/rule-chain.service.ts b/ui-ngx/src/app/core/http/rule-chain.service.ts index 15cd79c2e3..e3353989cc 100644 --- a/ui-ngx/src/app/core/http/rule-chain.service.ts +++ b/ui-ngx/src/app/core/http/rule-chain.service.ts @@ -14,7 +14,7 @@ /// limitations under the License. /// -import { ComponentFactory, Injectable } from '@angular/core'; +import { Injectable, Type } from '@angular/core'; import { defaultHttpOptionsFromConfig, RequestConfig } from './http-utils'; import { forkJoin, Observable, of } from 'rxjs'; import { HttpClient } from '@angular/common/http'; @@ -31,11 +31,13 @@ import { ComponentDescriptorService } from './component-descriptor.service'; import { IRuleNodeConfigurationComponent, LinkLabel, - RuleNodeComponentDescriptor, RuleNodeConfiguration, ScriptLanguage, + RuleNodeComponentDescriptor, + RuleNodeConfiguration, + ScriptLanguage, TestScriptInputParams, TestScriptResult } from '@app/shared/models/rule-node.models'; -import { ResourcesService } from '../services/resources.service'; +import { componentTypeBySelector, ResourcesService } from '../services/resources.service'; import { catchError, map, mergeMap } from 'rxjs/operators'; import { TranslateService } from '@ngx-translate/core'; import { deepClone, snakeCase } from '@core/utils'; @@ -50,7 +52,7 @@ export class RuleChainService { private ruleNodeComponentsMap: Map> = new Map>(); - private ruleNodeConfigFactories: {[directive: string]: ComponentFactory} = {}; + private ruleNodeConfigComponents: {[directive: string]: Type} = {}; constructor( private http: HttpClient, @@ -126,8 +128,8 @@ export class RuleChainService { } } - public getRuleNodeConfigFactory(directive: string): ComponentFactory { - return this.ruleNodeConfigFactories[directive]; + public getRuleNodeConfigComponent(directive: string): Type { + return this.ruleNodeConfigComponents[directive]; } public getRuleNodeComponentByClazz(ruleChainType: RuleChainType = RuleChainType.CORE, clazz: string): RuleNodeComponentDescriptor { @@ -219,14 +221,13 @@ export class RuleChainService { }); } if (moduleResource) { - tasks.push(this.resourcesService.loadFactories(moduleResource, modulesMap).pipe( + tasks.push(this.resourcesService.loadModulesWithComponents(moduleResource, modulesMap).pipe( map((res) => { if (nodeDefinition.configDirective && nodeDefinition.configDirective.length) { const selector = snakeCase(nodeDefinition.configDirective, '-'); - const componentFactory = res.factories.find((factory) => - factory.selector === selector); - if (componentFactory) { - this.ruleNodeConfigFactories[nodeDefinition.configDirective] = componentFactory; + const componentType = componentTypeBySelector(res, selector); + if (componentType) { + this.ruleNodeConfigComponents[nodeDefinition.configDirective] = componentType; } else { component.configurationDescriptor.nodeDefinition.uiResourceLoadError = this.translate.instant('rulenode.directive-is-not-loaded', diff --git a/ui-ngx/src/app/core/interceptors/entity-conflict.interceptor.ts b/ui-ngx/src/app/core/interceptors/entity-conflict.interceptor.ts index e4db59ec66..6575ba4f65 100644 --- a/ui-ngx/src/app/core/interceptors/entity-conflict.interceptor.ts +++ b/ui-ngx/src/app/core/interceptors/entity-conflict.interceptor.ts @@ -15,15 +15,7 @@ /// import { Injectable } from '@angular/core'; -import { - HttpErrorResponse, - HttpEvent, - HttpHandler, - HttpInterceptor, - HttpParams, - HttpRequest, - HttpStatusCode -} from '@angular/common/http'; +import { HttpErrorResponse, HttpEvent, HttpHandler, HttpInterceptor, HttpParams, HttpRequest, HttpStatusCode } from '@angular/common/http'; import { Observable, of, throwError } from 'rxjs'; import { catchError, switchMap } from 'rxjs/operators'; import { MatDialog } from '@angular/material/dialog'; diff --git a/ui-ngx/src/app/core/services/dynamic-component-factory.service.ts b/ui-ngx/src/app/core/services/dynamic-component-factory.service.ts index 1c7150bac3..40ac9c354b 100644 --- a/ui-ngx/src/app/core/services/dynamic-component-factory.service.ts +++ b/ui-ngx/src/app/core/services/dynamic-component-factory.service.ts @@ -18,6 +18,7 @@ import { Component, Injectable, Type, ɵComponentDef, ɵNG_COMP_DEF } from '@ang import { from, Observable, of } from 'rxjs'; import { CommonModule } from '@angular/common'; import { mergeMap } from 'rxjs/operators'; +import { guid } from '@core/utils'; @Injectable({ providedIn: 'root' @@ -30,14 +31,14 @@ export class DynamicComponentFactoryService { public createDynamicComponent( componentType: Type, template: string, - modules?: Type[], + imports?: Type[], preserveWhitespaces?: boolean, styles?: string[]): Observable> { return from(import('@angular/compiler')).pipe( mergeMap(() => { let componentImports: Type[] = [CommonModule]; - if (modules) { - componentImports = [...componentImports, ...modules]; + if (imports) { + componentImports = [...componentImports, ...imports]; } const comp = this.createAndCompileDynamicComponent(componentType, template, componentImports, preserveWhitespaces, styles); return of(comp.type); @@ -60,7 +61,8 @@ export class DynamicComponentFactoryService { imports, preserveWhitespaces, styles, - standalone: true + standalone: true, + selector: 'tb-dynamic-component#' + guid() })(componentType); // Trigger component compilation return comp[ɵNG_COMP_DEF]; diff --git a/ui-ngx/src/app/core/services/resources.service.ts b/ui-ngx/src/app/core/services/resources.service.ts index 013c3e5d72..3e45ad0d3c 100644 --- a/ui-ngx/src/app/core/services/resources.service.ts +++ b/ui-ngx/src/app/core/services/resources.service.ts @@ -15,16 +15,19 @@ /// import { - Compiler, - ComponentFactory, + createNgModule, Inject, Injectable, Injector, - ModuleWithComponentFactories, - Type, ɵNG_MOD_DEF + Type, + ɵComponentDef, + ɵCssSelectorList, + ɵNG_COMP_DEF, + ɵNG_MOD_DEF, + ɵNgModuleDef } from '@angular/core'; import { DOCUMENT } from '@angular/common'; -import { forkJoin, Observable, ReplaySubject, throwError } from 'rxjs'; +import { Observable, ReplaySubject, throwError } from 'rxjs'; import { HttpClient } from '@angular/common/http'; import { IModulesMap } from '@modules/common/modules-map.models'; import { TbResourceId } from '@shared/models/id/tb-resource-id'; @@ -36,13 +39,56 @@ import { AppState } from '@core/core.state'; import { map, tap } from 'rxjs/operators'; import { RequestConfig } from '@core/http/http-utils'; -declare const System; +export interface ModuleInfo { + module: ɵNgModuleDef; + components: ɵComponentDef[]; +} + +export interface ModulesWithComponents { + modules: ModuleInfo[]; + standaloneComponents: ɵComponentDef[]; +} + +export const flatModulesWithComponents = (modulesWithComponentsList: ModulesWithComponents[]): ModulesWithComponents => { + const modulesWithComponents: ModulesWithComponents = { + modules: [], + standaloneComponents: [] + }; + for (const m of modulesWithComponentsList) { + for (const module of m.modules) { + if (!modulesWithComponents.modules.some(m1 => m1.module === module.module)) { + modulesWithComponents.modules.push(module); + } + } + for (const comp of m.standaloneComponents) { + if (!modulesWithComponents.standaloneComponents.includes(comp)) { + modulesWithComponents.standaloneComponents.push(comp); + } + } + } + return modulesWithComponents; +} + +export const modulesWithComponentsToTypes = (modulesWithComponents: ModulesWithComponents): Type[] => + [...modulesWithComponents.modules.map(m => m.module.type), + ...modulesWithComponents.standaloneComponents.map(c => c.type)]; -export interface ModulesWithFactories { - modules: Type[]; - factories: ComponentFactory[]; +export const componentTypeBySelector = (modulesWithComponents: ModulesWithComponents, selector: string): Type | undefined => { + let found = modulesWithComponents.standaloneComponents.find(c => matchesSelector(c.selectors, selector)); + if (!found) { + for (const m of modulesWithComponents.modules) { + found = m.components.find(c => matchesSelector(c.selectors, selector)); + if (found) { + break; + } + } + } + return found?.type; } +const matchesSelector = (selectors: ɵCssSelectorList, selector: string) => + selectors.some(s => s.some(s1 => typeof s1 === 'string' && s1 === selector)); + @Injectable({ providedIn: 'root' }) @@ -50,16 +96,15 @@ export class ResourcesService { private loadedJsonResources: { [url: string]: ReplaySubject } = {}; private loadedResources: { [url: string]: ReplaySubject } = {}; - private loadedModulesAndFactories: { [url: string]: ReplaySubject } = {}; + private loadedModulesWithComponents: { [url: string]: ReplaySubject } = {}; private anchor = this.document.getElementsByTagName('head')[0] || this.document.getElementsByTagName('body')[0]; - constructor(@Inject(DOCUMENT) private readonly document: any, + constructor(@Inject(DOCUMENT) private readonly document: Document, protected store: Store, - private compiler: Compiler, private http: HttpClient, private injector: Injector) { - this.store.pipe(select(selectIsAuthenticated)).subscribe(() => this.clearModulesCache()); + this.store.pipe(select(selectIsAuthenticated)).subscribe(() => this.clearModulesWithComponentsCache()); } public loadJsonResource(url: string, postProcess?: (data: T) => T): Observable { @@ -93,7 +138,7 @@ export class ResourcesService { return this.loadedResources[url].asObservable(); } - let fileType; + let fileType: string; const match = /[./](css|less|html|htm|js)?(([?#]).*)?$/.exec(url); if (match !== null) { fileType = match[1]; @@ -137,53 +182,38 @@ export class ResourcesService { ); } - public loadFactories(resourceId: string | TbResourceId, modulesMap: IModulesMap): Observable { + public loadModulesWithComponents(resourceId: string | TbResourceId, modulesMap: IModulesMap): Observable { const url = this.getDownloadUrl(resourceId); - if (this.loadedModulesAndFactories[url]) { - return this.loadedModulesAndFactories[url].asObservable(); + if (this.loadedModulesWithComponents[url]) { + return this.loadedModulesWithComponents[url].asObservable(); } modulesMap.init(); const meta = this.getMetaInfo(resourceId); - const subject = new ReplaySubject(); - this.loadedModulesAndFactories[url] = subject; + const subject = new ReplaySubject(); + this.loadedModulesWithComponents[url] = subject; import('@angular/compiler').then( () => { + // @ts-ignore System.import(url, undefined, meta).then( - (module) => { - const modules = this.extractNgModules(module); - if (modules.length) { - const tasks: Promise>[] = []; - for (const m of modules) { - tasks.push(this.compiler.compileModuleAndAllComponentsAsync(m)); - } - forkJoin(tasks).subscribe({ - next: (compiled) => { - try { - const componentFactories: ComponentFactory[] = []; - for (const c of compiled) { - c.ngModuleFactory.create(this.injector); - componentFactories.push(...c.componentFactories); - } - const modulesWithFactories: ModulesWithFactories = { - modules, - factories: componentFactories - }; - this.loadedModulesAndFactories[url].next(modulesWithFactories); - this.loadedModulesAndFactories[url].complete(); - } catch (e) { - this.loadedModulesAndFactories[url].error(new Error(`Unable to init module from url: ${url}`)); - } - }, - error: (e) => { - this.loadedModulesAndFactories[url].error(new Error(`Unable to compile module from url: ${url}`)); + (module: any) => { + try { + const modulesWithComponents = this.extractModulesWithComponents(module); + if (modulesWithComponents.modules.length || modulesWithComponents.standaloneComponents.length) { + for (const module of modulesWithComponents.modules) { + createNgModule(module.module.type, this.injector); } - }); - } else { - this.loadedModulesAndFactories[url].error(new Error(`Module '${url}' doesn't have default export!`)); + this.loadedModulesWithComponents[url].next(modulesWithComponents); + this.loadedModulesWithComponents[url].complete(); + } else { + this.loadedModulesWithComponents[url].error(new Error(`Module '${url}' doesn't have exported modules or components!`)); + } + } catch (e) { + console.log(`Unable to parse module from url: ${url}`, e); + this.loadedModulesWithComponents[url].error(new Error(`Unable to parse module from url: ${url}`)); } }, - (e) => { - this.loadedModulesAndFactories[url].error(new Error(`Unable to load module from url: ${url}`)); + () => { + this.loadedModulesWithComponents[url].error(new Error(`Unable to load module from url: ${url}`)); } ); } @@ -192,7 +222,7 @@ export class ResourcesService { tap({ next: () => System.delete(url), error: () => { - delete this.loadedModulesAndFactories[url]; + delete this.loadedModulesWithComponents[url]; System.delete(url); }, complete: () => System.delete(url) @@ -200,41 +230,66 @@ export class ResourcesService { ); } - private extractNgModules(module: any, modules: Type[] = []): Type[] { - try { - let potentialModules = [module]; - let currentScanDepth = 0; - while (potentialModules.length && currentScanDepth < 10) { - const newPotentialModules = []; - for (const potentialModule of potentialModules) { - if (potentialModule && (ɵNG_MOD_DEF in potentialModule)) { - modules.push(potentialModule); + private extractModulesWithComponents(module: any, + modulesWithComponents: ModulesWithComponents = { + modules: [], + standaloneComponents: [] + }, + visitedModules: Set = new Set()): ModulesWithComponents { + if (module && ['object', 'function'].includes(typeof module)) { + if (ɵNG_MOD_DEF in module) { + const moduleDef: ɵNgModuleDef = module[ɵNG_MOD_DEF]; + if (!visitedModules.has(moduleDef.type)) { + visitedModules.add(moduleDef.type); + const moduleInfo: ModuleInfo = { + module: moduleDef, + components: [] + } + modulesWithComponents.modules.push(moduleInfo); + const exportsDecl = moduleDef.exports; + let exports: Type[]; + if (Array.isArray(exportsDecl)) { + exports = exportsDecl; } else { - for (const k of Object.keys(potentialModule)) { - if (!this.isPrimitive(potentialModule[k])) { - newPotentialModules.push(potentialModule[k]); + exports = exportsDecl(); + } + for (const element of exports) { + if (ɵNG_COMP_DEF in element) { + const component: ɵComponentDef = element[ɵNG_COMP_DEF]; + if (!component.standalone) { + moduleInfo.components.push(component); + } else { + modulesWithComponents.standaloneComponents.push(component); } + } else { + this.extractModulesWithComponents(module, modulesWithComponents, visitedModules); } } } - potentialModules = newPotentialModules; - currentScanDepth++; + } else if (ɵNG_COMP_DEF in module) { + const component: ɵComponentDef = module[ɵNG_COMP_DEF]; + if (component.standalone) { + if (!modulesWithComponents.standaloneComponents.includes(component)) { + modulesWithComponents.standaloneComponents.push(component); + } + } + } else { + for (const k of Object.keys(module)) { + const val = module[k]; + if (val && ['object', 'function'].includes(typeof val)) { + this.extractModulesWithComponents(val, modulesWithComponents, visitedModules); + } + } } - } catch (e) { - console.log('Could not load NgModule', e); } - return modules; - } - - private isPrimitive(test) { - return test !== Object(test); + return modulesWithComponents; } private loadResourceByType(type: 'css' | 'js', url: string): Observable { const subject = new ReplaySubject(); this.loadedResources[url] = subject; - let el; + let el: any; let loaded = false; switch (type) { case 'js': @@ -250,7 +305,7 @@ export class ResourcesService { el.href = url; break; } - el.onload = el.onreadystatechange = (e) => { + el.onload = el.onreadystatechange = () => { if (el.readyState && !/^c|loade/.test(el.readyState) || loaded) { return; } el.onload = el.onreadystatechange = null; loaded = true; @@ -282,7 +337,7 @@ export class ResourcesService { } } - private clearModulesCache() { - this.loadedModulesAndFactories = {}; + private clearModulesWithComponentsCache() { + this.loadedModulesWithComponents = {}; } } diff --git a/ui-ngx/src/app/core/settings/settings.utils.ts b/ui-ngx/src/app/core/settings/settings.utils.ts index 3730878237..9db2994fe1 100644 --- a/ui-ngx/src/app/core/settings/settings.utils.ts +++ b/ui-ngx/src/app/core/settings/settings.utils.ts @@ -16,7 +16,7 @@ import { environment as env } from '@env/environment'; import { TranslateService } from '@ngx-translate/core'; -import * as _moment from 'moment'; +import _moment from 'moment'; import { Observable } from 'rxjs'; export function updateUserLang(translate: TranslateService, userLang: string, translations = env.supportedLangs): Observable { diff --git a/ui-ngx/src/app/core/translate/translate-default-compiler.ts b/ui-ngx/src/app/core/translate/translate-default-compiler.ts index bd2954e422..58d4503b23 100644 --- a/ui-ngx/src/app/core/translate/translate-default-compiler.ts +++ b/ui-ngx/src/app/core/translate/translate-default-compiler.ts @@ -33,7 +33,7 @@ export class TranslateDefaultCompiler extends TranslateMessageFormatCompiler { super(config); } - public compile(value: string, lang: string): (params: any) => string { + public compile(value: string, lang: string): any { return this.defaultCompile(value, lang); } diff --git a/ui-ngx/src/app/modules/common/modules-map.ts b/ui-ngx/src/app/modules/common/modules-map.ts index 4b363fa1df..445fe9df42 100644 --- a/ui-ngx/src/app/modules/common/modules-map.ts +++ b/ui-ngx/src/app/modules/common/modules-map.ts @@ -78,7 +78,7 @@ import * as RxJs from 'rxjs'; import * as RxJsOperators from 'rxjs/operators'; import * as TranslateCore from '@ngx-translate/core'; import * as MatDateTimePicker from '@mat-datetimepicker/core'; -import * as _moment from 'moment'; +import _moment from 'moment'; import * as tslib from 'tslib'; import * as TbCore from '@core/public-api'; @@ -343,8 +343,6 @@ import { TimezoneComponent } from '@shared/components/time/timezone.component'; import { TimezonePanelComponent } from '@shared/components/time/timezone-panel.component'; import { DatapointsLimitComponent } from '@shared/components/time/datapoints-limit.component'; -declare const System; - class ModulesMap implements IModulesMap { private initialized = false; @@ -681,7 +679,7 @@ class ModulesMap implements IModulesMap { init() { if (!this.initialized) { - System.constructor.prototype.resolve = (id) => { + System.constructor.prototype.resolve = (id: string) => { try { if (this.modulesMap[id]) { return 'app:' + id; @@ -696,7 +694,7 @@ class ModulesMap implements IModulesMap { System.set('app:' + moduleId, this.modulesMap[moduleId]); } System.constructor.prototype.shouldFetch = (url: string) => url.endsWith('/download'); - System.constructor.prototype.fetch = (url, options: RequestInit & {meta?: any}) => { + System.constructor.prototype.fetch = (url: string, options: RequestInit & {meta?: any}) => { if (options?.meta?.additionalHeaders) { options.headers = { ...options.headers, ...options.meta.additionalHeaders }; } diff --git a/ui-ngx/src/app/modules/dashboard/dashboard-pages.routing.module.ts b/ui-ngx/src/app/modules/dashboard/dashboard-pages.routing.module.ts index da23f14414..189fea6e5c 100644 --- a/ui-ngx/src/app/modules/dashboard/dashboard-pages.routing.module.ts +++ b/ui-ngx/src/app/modules/dashboard/dashboard-pages.routing.module.ts @@ -15,7 +15,7 @@ /// import { Injectable, NgModule } from '@angular/core'; -import { ActivatedRouteSnapshot, Resolve, RouterModule, Routes } from '@angular/router'; +import { ActivatedRouteSnapshot, RouterModule, Routes } from '@angular/router'; import { Authority } from '@shared/models/authority.enum'; import { DashboardPageComponent } from '@home/components/dashboard-page/dashboard-page.component'; @@ -28,7 +28,7 @@ import { Widget } from '@app/shared/models/widget.models'; import { ConfirmOnExitGuard } from '@core/guards/confirm-on-exit.guard'; @Injectable() -export class WidgetEditorDashboardResolver implements Resolve { +export class WidgetEditorDashboardResolver { constructor(private dashboardService: DashboardService, private dashboardUtils: DashboardUtilsService, diff --git a/ui-ngx/src/app/modules/home/components/alarm/alarm-comment.component.scss b/ui-ngx/src/app/modules/home/components/alarm/alarm-comment.component.scss index ec48adfa11..d12778a409 100644 --- a/ui-ngx/src/app/modules/home/components/alarm/alarm-comment.component.scss +++ b/ui-ngx/src/app/modules/home/components/alarm/alarm-comment.component.scss @@ -16,8 +16,8 @@ @use '@angular/material' as mat; @import '../theme.scss'; -$primary-color: rgba(mat.get-color-from-palette($tb-primary, 50), 0.4); -$border: 1px solid mat.get-color-from-palette($tb-primary); +$primary-color: rgba(mat.m2-get-color-from-palette($tb-primary, 50), 0.4); +$border: 1px solid mat.m2-get-color-from-palette($tb-primary); :host { .tb-alarm-comments { diff --git a/ui-ngx/src/app/modules/home/components/dashboard-page/layout/manage-dashboard-layouts-dialog.component.scss b/ui-ngx/src/app/modules/home/components/dashboard-page/layout/manage-dashboard-layouts-dialog.component.scss index 0933cafaff..964d5177f0 100644 --- a/ui-ngx/src/app/modules/home/components/dashboard-page/layout/manage-dashboard-layouts-dialog.component.scss +++ b/ui-ngx/src/app/modules/home/components/dashboard-page/layout/manage-dashboard-layouts-dialog.component.scss @@ -17,7 +17,7 @@ @import '../theme.scss'; @import '../scss/constants.scss'; -$tb-warn: mat.get-color-from-palette(map-get($tb-theme, warn), text); +$tb-warn: mat.m2-get-color-from-palette(map-get($tb-theme, warn), text); :host { .tb-layout-fixed-container { @@ -35,7 +35,7 @@ $tb-warn: mat.get-color-from-palette(map-get($tb-theme, warn), text); .tb-layout-preview { width: 100%; - background-color: rgba(mat.get-color-from-palette($tb-primary, 50), 0.6); + background-color: rgba(mat.m2-get-color-from-palette($tb-primary, 50), 0.6); padding: 35px; &-container { diff --git a/ui-ngx/src/app/modules/home/components/dashboard-page/states/states-component.directive.ts b/ui-ngx/src/app/modules/home/components/dashboard-page/states/states-component.directive.ts index 9d413b7e81..f1f7313106 100644 --- a/ui-ngx/src/app/modules/home/components/dashboard-page/states/states-component.directive.ts +++ b/ui-ngx/src/app/modules/home/components/dashboard-page/states/states-component.directive.ts @@ -126,8 +126,7 @@ export class StatesComponentDirective implements OnInit, OnDestroy, OnChanges { } const stateControllerInstanceId = this.dashboardCtrl.dashboardCtx.instanceId + '_' + this.statesControllerId; const preservedState = this.statesControllerService.withdrawStateControllerState(stateControllerInstanceId); - const stateControllerFactory = stateControllerData.factory; - this.stateControllerComponentRef = this.viewContainerRef.createComponent(stateControllerFactory); + this.stateControllerComponentRef = this.viewContainerRef.createComponent(stateControllerData.component); this.stateControllerComponent = this.stateControllerComponentRef.instance; this.dashboardCtrl.dashboardCtx.stateController = this.stateControllerComponent; this.dashboardCtrl.dashboardCtx.stateChanged = this.stateChangedSubject.asObservable(); diff --git a/ui-ngx/src/app/modules/home/components/dashboard-page/states/states-controller.service.ts b/ui-ngx/src/app/modules/home/components/dashboard-page/states/states-controller.service.ts index efa6c19f74..5c0619b832 100644 --- a/ui-ngx/src/app/modules/home/components/dashboard-page/states/states-controller.service.ts +++ b/ui-ngx/src/app/modules/home/components/dashboard-page/states/states-controller.service.ts @@ -14,12 +14,12 @@ /// limitations under the License. /// -import { ComponentFactory, ComponentFactoryResolver, Injectable, Type } from '@angular/core'; +import { Injectable, Type } from '@angular/core'; import { deepClone } from '@core/utils'; import { IStateControllerComponent } from '@home/components/dashboard-page/states/state-controller.models'; export interface StateControllerData { - factory: ComponentFactory; + component: Type; } @Injectable() @@ -29,13 +29,12 @@ export class StatesControllerService { statesControllerStates: {[stateControllerInstanceId: string]: any} = {}; - constructor(private componentFactoryResolver: ComponentFactoryResolver) { + constructor() { } public registerStatesController(stateControllerId: string, stateControllerComponent: Type): void { - const componentFactory = this.componentFactoryResolver.resolveComponentFactory(stateControllerComponent); this.statesControllers[stateControllerId] = { - factory: componentFactory + component: stateControllerComponent }; } diff --git a/ui-ngx/src/app/modules/home/components/entity/add-entity-dialog.component.ts b/ui-ngx/src/app/modules/home/components/entity/add-entity-dialog.component.ts index 9fd6cd3792..224366a8cb 100644 --- a/ui-ngx/src/app/modules/home/components/entity/add-entity-dialog.component.ts +++ b/ui-ngx/src/app/modules/home/components/entity/add-entity-dialog.component.ts @@ -14,7 +14,7 @@ /// limitations under the License. /// -import { Component, ComponentFactoryResolver, Inject, Injector, OnInit, SkipSelf, ViewChild } from '@angular/core'; +import { Component, Inject, Injector, OnInit, SkipSelf, ViewChild } from '@angular/core'; import { ErrorStateMatcher } from '@angular/material/core'; import { MAT_DIALOG_DATA, MatDialogRef } from '@angular/material/dialog'; import { Store } from '@ngrx/store'; @@ -55,7 +55,6 @@ export class AddEntityDialogComponent extends protected router: Router, @Inject(MAT_DIALOG_DATA) public data: AddEntityDialogData>, public dialogRef: MatDialogRef>, - private componentFactoryResolver: ComponentFactoryResolver, private injector: Injector, @SkipSelf() private errorStateMatcher: ErrorStateMatcher) { super(store, router, dialogRef); @@ -66,7 +65,6 @@ export class AddEntityDialogComponent extends this.translations = this.entitiesTableConfig.entityTranslations; this.resources = this.entitiesTableConfig.entityResources; this.entity = {}; - const componentFactory = this.componentFactoryResolver.resolveComponentFactory(this.entitiesTableConfig.entityComponent); const viewContainerRef = this.entityDetailsFormAnchor.viewContainerRef; viewContainerRef.clear(); const injector: Injector = Injector.create( @@ -84,7 +82,7 @@ export class AddEntityDialogComponent extends parent: this.injector } ); - const componentRef = viewContainerRef.createComponent(componentFactory, 0, injector); + const componentRef = viewContainerRef.createComponent(this.entitiesTableConfig.entityComponent, {index: 0, injector}); this.entityComponent = componentRef.instance; this.entityComponent.isEdit = true; this.detailsForm = this.entityComponent.entityForm; diff --git a/ui-ngx/src/app/modules/home/components/entity/entities-table.component.ts b/ui-ngx/src/app/modules/home/components/entity/entities-table.component.ts index 96b272f2d2..9bb5fe4d8a 100644 --- a/ui-ngx/src/app/modules/home/components/entity/entities-table.component.ts +++ b/ui-ngx/src/app/modules/home/components/entity/entities-table.component.ts @@ -19,7 +19,6 @@ import { ChangeDetectionStrategy, ChangeDetectorRef, Component, - ComponentFactoryResolver, ElementRef, EventEmitter, Input, NgZone, @@ -140,7 +139,6 @@ export class EntitiesTableComponent extends PageComponent implements IEntitiesTa private domSanitizer: DomSanitizer, private cd: ChangeDetectorRef, private router: Router, - private componentFactoryResolver: ComponentFactoryResolver, private elementRef: ElementRef, private fb: FormBuilder, private zone: NgZone) { @@ -193,10 +191,9 @@ export class EntitiesTableComponent extends PageComponent implements IEntitiesTa this.entitiesTableConfig = entitiesTableConfig; this.pageMode = this.entitiesTableConfig.pageMode; if (this.entitiesTableConfig.headerComponent) { - const componentFactory = this.componentFactoryResolver.resolveComponentFactory(this.entitiesTableConfig.headerComponent); const viewContainerRef = this.entityTableHeaderAnchor.viewContainerRef; viewContainerRef.clear(); - const componentRef = viewContainerRef.createComponent(componentFactory); + const componentRef = viewContainerRef.createComponent(this.entitiesTableConfig.headerComponent); const headerComponent = componentRef.instance; headerComponent.entitiesTableConfig = this.entitiesTableConfig; } diff --git a/ui-ngx/src/app/modules/home/components/entity/entity-details-page.component.ts b/ui-ngx/src/app/modules/home/components/entity/entity-details-page.component.ts index 6cce657cbb..baa46b135d 100644 --- a/ui-ngx/src/app/modules/home/components/entity/entity-details-page.component.ts +++ b/ui-ngx/src/app/modules/home/components/entity/entity-details-page.component.ts @@ -18,7 +18,6 @@ import { ChangeDetectionStrategy, ChangeDetectorRef, Component, - ComponentFactoryResolver, HostBinding, Injector, OnDestroy, @@ -30,7 +29,6 @@ import { EntityTableConfig } from '@home/models/entity/entities-table-config.mod import { BaseData, HasId } from '@shared/models/base-data'; import { ActivatedRoute, Router } from '@angular/router'; import { UntypedFormGroup } from '@angular/forms'; -import { AssetId } from '@shared/models/id/asset-id'; import { TranslateService } from '@ngx-translate/core'; import { deepClone } from '@core/utils'; import { BroadcastService } from '@core/services/broadcast.service'; @@ -74,12 +72,11 @@ export class EntityDetailsPageComponent extends EntityDetailsPanelComponent impl private router: Router, protected injector: Injector, protected cd: ChangeDetectorRef, - protected componentFactoryResolver: ComponentFactoryResolver, private broadcast: BroadcastService, private translate: TranslateService, private dialogService: DialogService, protected store: Store) { - super(store, injector, cd, componentFactoryResolver); + super(store, injector, cd); this.entitiesTableConfig = this.route.snapshot.data.entitiesTableConfig; this.backNavigationCommands = this.route.snapshot.data.backNavigationCommands; } diff --git a/ui-ngx/src/app/modules/home/components/entity/entity-details-panel.component.ts b/ui-ngx/src/app/modules/home/components/entity/entity-details-panel.component.ts index 1ec56028af..3c47058cfe 100644 --- a/ui-ngx/src/app/modules/home/components/entity/entity-details-panel.component.ts +++ b/ui-ngx/src/app/modules/home/components/entity/entity-details-panel.component.ts @@ -19,7 +19,6 @@ import { ChangeDetectionStrategy, ChangeDetectorRef, Component, - ComponentFactoryResolver, ComponentRef, EventEmitter, Injector, @@ -97,8 +96,7 @@ export class EntityDetailsPanelComponent extends PageComponent implements AfterV constructor(protected store: Store, protected injector: Injector, - protected cd: ChangeDetectorRef, - protected componentFactoryResolver: ComponentFactoryResolver) { + protected cd: ChangeDetectorRef) { super(store); } @@ -167,7 +165,6 @@ export class EntityDetailsPanelComponent extends PageComponent implements AfterV this.entityComponentRef.destroy(); this.entityComponentRef = null; } - const componentFactory = this.componentFactoryResolver.resolveComponentFactory(this.entitiesTableConfig.entityComponent); const viewContainerRef = this.entityDetailsFormAnchor.viewContainerRef; viewContainerRef.clear(); const injector: Injector = Injector.create( @@ -185,7 +182,7 @@ export class EntityDetailsPanelComponent extends PageComponent implements AfterV parent: this.injector } ); - this.entityComponentRef = viewContainerRef.createComponent(componentFactory, 0, injector); + this.entityComponentRef = viewContainerRef.createComponent(this.entitiesTableConfig.entityComponent, {index: 0, injector}); this.entityComponent = this.entityComponentRef.instance; this.entityComponent.isEdit = this.isEdit; this.detailsForm = this.entityComponent.entityForm; @@ -207,8 +204,7 @@ export class EntityDetailsPanelComponent extends PageComponent implements AfterV viewContainerRef.clear(); this.entityTabsComponent = null; if (this.entitiesTableConfig.entityTabsComponent) { - const componentTabsFactory = this.componentFactoryResolver.resolveComponentFactory(this.entitiesTableConfig.entityTabsComponent); - this.entityTabsComponentRef = viewContainerRef.createComponent(componentTabsFactory); + this.entityTabsComponentRef = viewContainerRef.createComponent(this.entitiesTableConfig.entityTabsComponent); this.entityTabsComponent = this.entityTabsComponentRef.instance; this.entityTabsComponent.isEdit = this.isEdit; this.entityTabsComponent.entitiesTableConfig = this.entitiesTableConfig; diff --git a/ui-ngx/src/app/modules/home/components/notification/notification-bell.component.html b/ui-ngx/src/app/modules/home/components/notification/notification-bell.component.html index d5b76e7be5..ae35b1eef2 100644 --- a/ui-ngx/src/app/modules/home/components/notification/notification-bell.component.html +++ b/ui-ngx/src/app/modules/home/components/notification/notification-bell.component.html @@ -16,5 +16,5 @@ --> diff --git a/ui-ngx/src/app/modules/home/components/profile/add-device-profile-dialog.component.ts b/ui-ngx/src/app/modules/home/components/profile/add-device-profile-dialog.component.ts index e6a2a1c7fd..cee7426e26 100644 --- a/ui-ngx/src/app/modules/home/components/profile/add-device-profile-dialog.component.ts +++ b/ui-ngx/src/app/modules/home/components/profile/add-device-profile-dialog.component.ts @@ -14,16 +14,7 @@ /// limitations under the License. /// -import { - AfterViewInit, - Component, - ComponentFactoryResolver, - Inject, - Injector, - SkipSelf, - ViewChild -} from '@angular/core'; -import { ErrorStateMatcher } from '@angular/material/core'; +import { Component, Inject, ViewChild } from '@angular/core'; import { MAT_DIALOG_DATA, MatDialogRef } from '@angular/material/dialog'; import { Store } from '@ngrx/store'; import { AppState } from '@core/core.state'; @@ -68,7 +59,7 @@ export interface AddDeviceProfileDialogData { styleUrls: ['./add-device-profile-dialog.component.scss'] }) export class AddDeviceProfileDialogComponent extends - DialogComponent implements AfterViewInit { + DialogComponent { @ViewChild('addDeviceProfileStepper', {static: true}) addDeviceProfileStepper: MatStepper; stepperOrientation: Observable; @@ -105,10 +96,7 @@ export class AddDeviceProfileDialogComponent extends protected router: Router, @Inject(MAT_DIALOG_DATA) public data: AddDeviceProfileDialogData, public dialogRef: MatDialogRef, - private componentFactoryResolver: ComponentFactoryResolver, - private injector: Injector, private breakpointObserver: BreakpointObserver, - @SkipSelf() private errorStateMatcher: ErrorStateMatcher, private deviceProfileService: DeviceProfileService, private fb: UntypedFormBuilder) { super(store, router, dialogRef); @@ -162,9 +150,6 @@ export class AddDeviceProfileDialogComponent extends {transportConfiguration: createDeviceProfileTransportConfiguration(deviceTransportType)}); } - ngAfterViewInit(): void { - } - cancel(): void { this.dialogRef.close(null); } diff --git a/ui-ngx/src/app/modules/home/components/profile/asset-profile-dialog.component.ts b/ui-ngx/src/app/modules/home/components/profile/asset-profile-dialog.component.ts index 0c726bf3d6..e69b1cf2ce 100644 --- a/ui-ngx/src/app/modules/home/components/profile/asset-profile-dialog.component.ts +++ b/ui-ngx/src/app/modules/home/components/profile/asset-profile-dialog.component.ts @@ -14,20 +14,12 @@ /// limitations under the License. /// -import { - AfterViewInit, - Component, - ComponentFactoryResolver, - Inject, - Injector, - SkipSelf, - ViewChild -} from '@angular/core'; +import { AfterViewInit, Component, Inject, SkipSelf, ViewChild } from '@angular/core'; import { ErrorStateMatcher } from '@angular/material/core'; import { MAT_DIALOG_DATA, MatDialogRef } from '@angular/material/dialog'; import { Store } from '@ngrx/store'; import { AppState } from '@core/core.state'; -import { UntypedFormControl, FormGroupDirective, NgForm } from '@angular/forms'; +import { FormGroupDirective, NgForm, UntypedFormControl } from '@angular/forms'; import { DialogComponent } from '@shared/components/dialog.component'; import { Router } from '@angular/router'; import { AssetProfile } from '@shared/models/asset.models'; @@ -59,8 +51,6 @@ export class AssetProfileDialogComponent extends protected router: Router, @Inject(MAT_DIALOG_DATA) public data: AssetProfileDialogData, public dialogRef: MatDialogRef, - private componentFactoryResolver: ComponentFactoryResolver, - private injector: Injector, @SkipSelf() private errorStateMatcher: ErrorStateMatcher, private assetProfileService: AssetProfileService) { super(store, router, dialogRef); diff --git a/ui-ngx/src/app/modules/home/components/profile/device-profile-dialog.component.ts b/ui-ngx/src/app/modules/home/components/profile/device-profile-dialog.component.ts index 4622bc2d3a..27e4ff95f1 100644 --- a/ui-ngx/src/app/modules/home/components/profile/device-profile-dialog.component.ts +++ b/ui-ngx/src/app/modules/home/components/profile/device-profile-dialog.component.ts @@ -14,20 +14,12 @@ /// limitations under the License. /// -import { - AfterViewInit, - Component, - ComponentFactoryResolver, - Inject, - Injector, - SkipSelf, - ViewChild -} from '@angular/core'; +import { AfterViewInit, Component, Inject, SkipSelf, ViewChild } from '@angular/core'; import { ErrorStateMatcher } from '@angular/material/core'; import { MAT_DIALOG_DATA, MatDialogRef } from '@angular/material/dialog'; import { Store } from '@ngrx/store'; import { AppState } from '@core/core.state'; -import { UntypedFormControl, FormGroupDirective, NgForm } from '@angular/forms'; +import { FormGroupDirective, NgForm, UntypedFormControl } from '@angular/forms'; import { DialogComponent } from '@shared/components/dialog.component'; import { Router } from '@angular/router'; import { DeviceProfile } from '@shared/models/device.models'; @@ -59,8 +51,6 @@ export class DeviceProfileDialogComponent extends protected router: Router, @Inject(MAT_DIALOG_DATA) public data: DeviceProfileDialogData, public dialogRef: MatDialogRef, - private componentFactoryResolver: ComponentFactoryResolver, - private injector: Injector, @SkipSelf() private errorStateMatcher: ErrorStateMatcher, private deviceProfileService: DeviceProfileService) { super(store, router, dialogRef); diff --git a/ui-ngx/src/app/modules/home/components/profile/tenant-profile-dialog.component.ts b/ui-ngx/src/app/modules/home/components/profile/tenant-profile-dialog.component.ts index 9face5403b..7a5453912d 100644 --- a/ui-ngx/src/app/modules/home/components/profile/tenant-profile-dialog.component.ts +++ b/ui-ngx/src/app/modules/home/components/profile/tenant-profile-dialog.component.ts @@ -14,20 +14,12 @@ /// limitations under the License. /// -import { - AfterViewInit, - Component, - ComponentFactoryResolver, - Inject, - Injector, - SkipSelf, - ViewChild -} from '@angular/core'; +import { AfterViewInit, Component, Inject, SkipSelf, ViewChild } from '@angular/core'; import { ErrorStateMatcher } from '@angular/material/core'; import { MAT_DIALOG_DATA, MatDialogRef } from '@angular/material/dialog'; import { Store } from '@ngrx/store'; import { AppState } from '@core/core.state'; -import { UntypedFormControl, FormGroupDirective, NgForm } from '@angular/forms'; +import { FormGroupDirective, NgForm, UntypedFormControl } from '@angular/forms'; import { DialogComponent } from '@shared/components/dialog.component'; import { Router } from '@angular/router'; import { TenantProfile } from '@shared/models/tenant.model'; @@ -59,8 +51,6 @@ export class TenantProfileDialogComponent extends protected router: Router, @Inject(MAT_DIALOG_DATA) public data: TenantProfileDialogData, public dialogRef: MatDialogRef, - private componentFactoryResolver: ComponentFactoryResolver, - private injector: Injector, @SkipSelf() private errorStateMatcher: ErrorStateMatcher, private tenantProfileService: TenantProfileService) { super(store, router, dialogRef); diff --git a/ui-ngx/src/app/modules/home/components/widget/config/data-keys.component.ts b/ui-ngx/src/app/modules/home/components/widget/config/data-keys.component.ts index e01d7e808a..d52a460f54 100644 --- a/ui-ngx/src/app/modules/home/components/widget/config/data-keys.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/config/data-keys.component.ts @@ -310,7 +310,7 @@ export class DataKeysComponent implements ControlValueAccessor, OnInit, OnChange } }), filter((value) => typeof value === 'string'), - map((value) => value ? (typeof value === 'string' ? value : value.name) : ''), + map((value) => value ? value : ''), mergeMap(name => this.fetchKeys(name) ), share() ); diff --git a/ui-ngx/src/app/modules/home/components/widget/config/widget-settings.component.ts b/ui-ngx/src/app/modules/home/components/widget/config/widget-settings.component.ts index e1ff910ab2..d8060d7d0e 100644 --- a/ui-ngx/src/app/modules/home/components/widget/config/widget-settings.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/config/widget-settings.component.ts @@ -15,15 +15,12 @@ /// import { - AfterViewInit, Component, - ComponentFactoryResolver, ComponentRef, forwardRef, Input, OnChanges, OnDestroy, - OnInit, SimpleChanges, ViewChild, ViewContainerRef @@ -49,7 +46,6 @@ import { Dashboard } from '@shared/models/dashboard.models'; import { WidgetService } from '@core/http/widget.service'; import { IAliasController } from '@core/api/widget-api.models'; import { WidgetConfigComponentData } from '@home/models/widget-component.models'; -import { DataKeysCallbacks } from '@home/components/widget/config/data-keys.component.models'; import { WidgetConfigCallbacks } from '@home/components/widget/config/widget-config.component.models'; @Component({ @@ -67,7 +63,7 @@ import { WidgetConfigCallbacks } from '@home/components/widget/config/widget-con multi: true }] }) -export class WidgetSettingsComponent implements ControlValueAccessor, OnInit, OnDestroy, AfterViewInit, OnChanges, Validator { +export class WidgetSettingsComponent implements ControlValueAccessor, OnDestroy, OnChanges, Validator { @ViewChild('definedSettingsContent', {read: ViewContainerRef, static: true}) definedSettingsContainer: ViewContainerRef; @@ -106,7 +102,6 @@ export class WidgetSettingsComponent implements ControlValueAccessor, OnInit, On private propagateChange = (_v: any) => { }; constructor(private translate: TranslateService, - private cfr: ComponentFactoryResolver, private widgetService: WidgetService, private fb: UntypedFormBuilder) { this.widgetSettingsFormGroup = this.fb.group({ @@ -121,9 +116,6 @@ export class WidgetSettingsComponent implements ControlValueAccessor, OnInit, On registerOnTouched(fn: any): void { } - ngOnInit(): void { - } - ngOnChanges(changes: SimpleChanges): void { for (const propName of Object.keys(changes)) { const change = changes[propName]; @@ -164,9 +156,6 @@ export class WidgetSettingsComponent implements ControlValueAccessor, OnInit, On } } - ngAfterViewInit(): void { - } - setDisabledState(isDisabled: boolean): void { this.disabled = isDisabled; if (this.disabled) { @@ -232,8 +221,7 @@ export class WidgetSettingsComponent implements ControlValueAccessor, OnInit, On this.changeSubscription = null; } this.definedSettingsContainer.clear(); - const factory = this.cfr.resolveComponentFactory(componentType); - this.definedSettingsComponentRef = this.definedSettingsContainer.createComponent(factory); + this.definedSettingsComponentRef = this.definedSettingsContainer.createComponent(componentType); this.definedSettingsComponent = this.definedSettingsComponentRef.instance; this.definedSettingsComponent.aliasController = this.aliasController; this.definedSettingsComponent.callbacks = this.callbacks; diff --git a/ui-ngx/src/app/modules/home/components/widget/dialog/custom-dialog.service.ts b/ui-ngx/src/app/modules/home/components/widget/dialog/custom-dialog.service.ts index 2705a8902c..3dac11f7b6 100644 --- a/ui-ngx/src/app/modules/home/components/widget/dialog/custom-dialog.service.ts +++ b/ui-ngx/src/app/modules/home/components/widget/dialog/custom-dialog.service.ts @@ -35,7 +35,7 @@ import { @Injectable() export class CustomDialogService { - private customModules: Array>; + private customImports: Array>; constructor( private dynamicComponentFactoryService: DynamicComponentFactoryService, @@ -47,19 +47,19 @@ export class CustomDialogService { ) { } - setAdditionalModules(modules: Array>) { - this.customModules = modules; + setAdditionalImports(imports: Array>) { + this.customImports = imports; } customDialog(template: string, controller: (instance: CustomDialogComponent) => void, data?: any, config?: MatDialogConfig): Observable { - const modules = [this.sharedModule, CommonModule, this.sharedHomeComponentsModule, this.homeComponentsModule, + const imports = [this.sharedModule, CommonModule, this.sharedHomeComponentsModule, this.homeComponentsModule, this.widgetComponentsModule]; - if (Array.isArray(this.customModules)) { - modules.push(...this.customModules); + if (Array.isArray(this.customImports)) { + imports.push(...this.customImports); } return this.dynamicComponentFactoryService.createDynamicComponent( - class CustomDialogComponentInstance extends CustomDialogComponent {}, template, modules).pipe( + class CustomDialogComponentInstance extends CustomDialogComponent {}, template, imports).pipe( mergeMap((componentType) => { const dialogData: CustomDialogContainerData = { controller, diff --git a/ui-ngx/src/app/modules/home/components/widget/dialog/embed-dashboard-dialog.component.ts b/ui-ngx/src/app/modules/home/components/widget/dialog/embed-dashboard-dialog.component.ts index a14fbe37a8..362764fd18 100644 --- a/ui-ngx/src/app/modules/home/components/widget/dialog/embed-dashboard-dialog.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/dialog/embed-dashboard-dialog.component.ts @@ -14,15 +14,7 @@ /// limitations under the License. /// -import { - Component, - ComponentFactoryResolver, - Inject, - Injector, - OnInit, - ViewChild, - ViewContainerRef -} from '@angular/core'; +import { Component, Inject, OnInit, ViewChild, ViewContainerRef } from '@angular/core'; import { MAT_DIALOG_DATA, MatDialogRef } from '@angular/material/dialog'; import { Store } from '@ngrx/store'; import { AppState } from '@core/core.state'; diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/chart/time-series-chart-bar.models.ts b/ui-ngx/src/app/modules/home/components/widget/lib/chart/time-series-chart-bar.models.ts index 22d2a26473..c648dceb2a 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/chart/time-series-chart-bar.models.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/chart/time-series-chart-bar.models.ts @@ -107,9 +107,9 @@ export const renderTimeSeriesBar = (params: CustomSeriesRenderItemParams, api: C } let lowerLeft: number[]; if (offset !== 0 && isNumeric(value)) { - lowerLeft = api.coord([startTime, value >= 0 ? Number(value) + offset : offset]); + lowerLeft = api.coord([startTime, Number(value) >= 0 ? Number(value) + offset : offset]); } else { - lowerLeft = api.coord([startTime, value >= 0 ? value : 0]); + lowerLeft = api.coord([startTime, value]); } const size = api.size([delta, value]); const width = size[0]; @@ -140,7 +140,7 @@ export const renderTimeSeriesBar = (params: CustomSeriesRenderItemParams, api: C if (renderCtx.labelOption.show) { let position = renderCtx.labelOption.position; - if (value < 0) { + if (Number(value) < 0) { if (position === 'top') { position = 'bottom'; } else if (position === 'bottom') { @@ -164,7 +164,7 @@ export const renderTimeSeriesBar = (params: CustomSeriesRenderItemParams, api: C } let borderRadius: number[]; - if (value < 0) { + if (Number(value) < 0) { borderRadius = [0, 0, renderCtx.visualSettings.borderRadius, renderCtx.visualSettings.borderRadius]; } else { borderRadius = [renderCtx.visualSettings.borderRadius, renderCtx.visualSettings.borderRadius, 0, 0]; diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/chart/time-series-chart.models.ts b/ui-ngx/src/app/modules/home/components/widget/lib/chart/time-series-chart.models.ts index d90f7c9b10..1eb3c3bfc5 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/chart/time-series-chart.models.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/chart/time-series-chart.models.ts @@ -1012,7 +1012,6 @@ export const createTimeSeriesXAxis = (id: string, mainType: 'xAxis', show: settings.show, type: 'time', - scale: true, position: settings.position, id, name: utils.customTranslation(settings.label, settings.label), diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/date-range-navigator/date-range-navigator.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/date-range-navigator/date-range-navigator.component.ts index 73f227c9ad..9db4f8308c 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/date-range-navigator/date-range-navigator.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/date-range-navigator/date-range-navigator.component.ts @@ -41,7 +41,7 @@ import { getFormattedDate } from '@home/components/widget/lib/date-range-navigator/date-range-navigator.models'; import { KeyValue } from '@angular/common'; -import * as _moment from 'moment'; +import _moment from 'moment'; import { ConnectedPosition, Overlay, OverlayConfig, OverlayRef } from '@angular/cdk/overlay'; import { ComponentPortal } from '@angular/cdk/portal'; import { MatSelect } from '@angular/material/select'; diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/date-range-navigator/date-range-navigator.models.ts b/ui-ngx/src/app/modules/home/components/widget/lib/date-range-navigator/date-range-navigator.models.ts index c25b04c9c9..b613d855e0 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/date-range-navigator/date-range-navigator.models.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/date-range-navigator/date-range-navigator.models.ts @@ -14,7 +14,7 @@ /// limitations under the License. /// -import * as _moment from 'moment'; +import _moment from 'moment'; export type DateRangeInterval = 'hour' | 'day' | 'week' | 'twoWeeks' | 'month' | 'threeMonths' | 'sixMonths'; diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/flot-widget.ts b/ui-ngx/src/app/modules/home/components/widget/lib/flot-widget.ts index 2c46864388..6bf4d21b24 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/flot-widget.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/flot-widget.ts @@ -54,7 +54,7 @@ import { TbFlotTicksFormatterFunction, TooltipValueFormatFunction } from './flot-widget.models'; -import * as moment_ from 'moment'; +import moment_ from 'moment'; import tinycolor from 'tinycolor2'; import { AggregationType, IntervalMath } from '@shared/models/time/time.models'; import { CancelAnimationFrame } from '@core/services/raf.service'; diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/maps/common-maps-utils.ts b/ui-ngx/src/app/modules/home/components/widget/lib/maps/common-maps-utils.ts index 01797502c7..25f7b1ceec 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/maps/common-maps-utils.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/maps/common-maps-utils.ts @@ -14,7 +14,6 @@ /// limitations under the License. /// -import { MapProviders } from '@home/components/widget/lib/maps/map-models'; import { createLabelFromDatasource, hashCode, @@ -58,7 +57,7 @@ export function findAngle(startPoint: FormattedData, endPoint: FormattedData, la } -export function getDefCenterPosition(position): [number, number] { +export function getDefCenterPosition(position: string | [number, number]): [number, number] { if (typeof (position) === 'string') { const parts = position.split(','); if (parts.length === 2) { @@ -258,8 +257,8 @@ export const parseWithTranslation = { } }; -export function functionValueCalculator(useFunction: boolean, func: (...args: any[]) => any, params = [], defaultValue: any) { - let res; +export function functionValueCalculator(useFunction: boolean, func: (...args: any[]) => any, params = [], defaultValue: T): T { + let res: T; if (useFunction && isDefined(func) && isFunction(func)) { try { res = func(...params); diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/maps/leaflet-map.ts b/ui-ngx/src/app/modules/home/components/widget/lib/maps/leaflet-map.ts index 5540c1351a..29b2768e58 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/maps/leaflet-map.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/maps/leaflet-map.ts @@ -14,10 +14,10 @@ /// limitations under the License. /// -import L, { FeatureGroup, LatLngBounds, LatLngTuple, Projection } from 'leaflet'; +import L, { FeatureGroup, LatLngBounds, LatLngTuple, PointExpression, Projection } from 'leaflet'; import tinycolor from 'tinycolor2'; import 'leaflet-providers'; -import { MarkerClusterGroup, MarkerClusterGroupOptions } from 'leaflet.markercluster/dist/leaflet.markercluster'; +import 'leaflet.markercluster'; import '@geoman-io/leaflet-geoman-free'; import { @@ -41,7 +41,8 @@ import { entitiesParseName, isCutPolygon, isJSON, - isValidLatLng + isValidLatLng, + LabelSettings } from '@home/components/widget/lib/maps/maps-utils'; import { checkLngLat, createLoadingDiv } from '@home/components/widget/lib/maps/common-maps-utils'; import { WidgetContext } from '@home/models/widget-component.models'; @@ -76,7 +77,7 @@ export default abstract class LeafletMap { options: WidgetUnitedMapSettings; bounds: L.LatLngBounds; datasources: FormattedData[]; - markersCluster: MarkerClusterGroup; + markersCluster: L.MarkerClusterGroup; points: FeatureGroup; markersData: FormattedData[] = []; polygonsData: FormattedData[] = []; @@ -99,9 +100,7 @@ export default abstract class LeafletMap { selectedEntity: FormattedData; ignoreUpdateBounds = false; initDragModeIgnoreUpdateBoundsSet = false; - // eslint-disable-next-line @typescript-eslint/dot-notation southWest = new L.LatLng(-Projection.SphericalMercator['MAX_LATITUDE'], -180); - // eslint-disable-next-line @typescript-eslint/dot-notation northEast = new L.LatLng(Projection.SphericalMercator['MAX_LATITUDE'], 180); saveLocation: (e: FormattedData, values: {[key: string]: any}) => Observable; saveMarkerLocation: (e: FormattedData, lat?: number, lng?: number) => Observable; @@ -109,7 +108,7 @@ export default abstract class LeafletMap { translateService: TranslateService; tooltipInstances: ITooltipsterInstance[] = []; - clusteringSettings: MarkerClusterGroupOptions; + clusteringSettings: L.MarkerClusterGroupOptions; protected constructor(public ctx: WidgetContext, public $container: HTMLElement, @@ -185,13 +184,13 @@ export default abstract class LeafletMap { if (markerClusteringSettings.maxZoom && markerClusteringSettings.maxZoom >= 0 && markerClusteringSettings.maxZoom < 19) { this.clusteringSettings.disableClusteringAtZoom = Math.floor(markerClusteringSettings.maxZoom); } - this.markersCluster = new MarkerClusterGroup(this.clusteringSettings); + this.markersCluster = new L.MarkerClusterGroup(this.clusteringSettings); } } private selectEntityWithoutLocationDialog(shapes: L.PM.SUPPORTED_SHAPES): Observable { - let entities; - let labelSettings; + let entities: FormattedData[]; + let labelSettings: LabelSettings; switch (shapes) { case 'Polygon': case 'Rectangle': @@ -244,8 +243,8 @@ export default abstract class LeafletMap { if (data !== null) { this.selectedEntity = data; this.toggleDrawMode(type); - let tooltipText; - let customTranslation; + let tooltipText: string; + let customTranslation: L.PM.Translations; switch (type) { case 'tbMarker': tooltipText = this.translateService.instant('widgets.maps.tooltips.placeMarker', {entityName: data.entityParseName}); @@ -310,7 +309,7 @@ export default abstract class LeafletMap { this.map.pm.Toolbar.copyDrawControl('Marker', { name: 'tbMarker', afterClick: () => this.selectEntityWithoutLocation('tbMarker'), - disabled: true, + disabled: false, actions }); } @@ -336,14 +335,14 @@ export default abstract class LeafletMap { this.map.pm.Toolbar.copyDrawControl('Rectangle', { name: 'tbRectangle', afterClick: () => this.selectEntityWithoutLocation('tbRectangle'), - disabled: true, + disabled: false, actions: rectangleActions }); this.map.pm.Toolbar.copyDrawControl('Polygon', { name: 'tbPolygon', afterClick: () => this.selectEntityWithoutLocation('tbPolygon'), - disabled: true, + disabled: false, actions: polygonActions }); } @@ -426,7 +425,7 @@ export default abstract class LeafletMap { switch (e.shape) { case 'tbMarker': // @ts-ignore - this.saveLocation(this.selectedEntity, this.convertToCustomFormat(e.layer.getLatLng())).subscribe(() => {}); + this.saveLocation(this.selectedEntity, this.convertToCustomFormat(e.marker.getLatLng())).subscribe(() => {}); break; case 'tbRectangle': case 'tbPolygon': @@ -567,8 +566,8 @@ export default abstract class LeafletMap { } $(this.ctx.$container) .find('a[role="button"]:not(.leaflet-pm-action)') - .each((index, element) => { - let title; + .each((_index, element) => { + let title: string; if (element.title) { title = element.title; $(element).removeAttr('title'); @@ -589,7 +588,12 @@ export default abstract class LeafletMap { }, side: 'right', distance: 2, - trackOrigin: true + trackOrigin: true, + functionBefore: (instance, helper) => { + if (helper.origin.ariaDisabled === 'true' || helper.origin.parentElement.classList.contains('active')) { + return false; + } + }, } ); this.tooltipInstances.push(tooltip.tooltipster('instance')); @@ -623,7 +627,7 @@ export default abstract class LeafletMap { return this.map.getCenter(); } - fitBounds(bounds: LatLngBounds, padding?: LatLngTuple) { + fitBounds(bounds: LatLngBounds, padding?: PointExpression) { if (bounds.isValid()) { this.bounds = !!this.bounds ? this.bounds.extend(bounds) : bounds; if (!this.options.fitMapBounds && this.options.defaultZoomLevel) { @@ -669,7 +673,7 @@ export default abstract class LeafletMap { return L.latLng(position.x, position.y) as L.LatLng; } - convertPosition(data: FormattedData, dsData: FormattedData[]): L.LatLng { + convertPosition(data: FormattedData, _dsData: FormattedData[]): L.LatLng { const position = this.extractPosition(data); if (position) { return this.positionToLatLng(position); @@ -1075,7 +1079,7 @@ export default abstract class LeafletMap { } }); const toDelete: string[] = []; - this.polylines.forEach((v, mKey) => { + this.polylines.forEach((_v, mKey) => { if (!keys.includes(mKey)) { toDelete.push(mKey); } @@ -1145,7 +1149,7 @@ export default abstract class LeafletMap { } }); const toDelete: string[] = []; - this.polygons.forEach((v, mKey) => { + this.polygons.forEach((_v, mKey) => { if (!keys.includes(mKey)) { toDelete.push(mKey); } diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/maps/map-models.ts b/ui-ngx/src/app/modules/home/components/widget/lib/maps/map-models.ts index afe07ea1ed..af8f51ffdd 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/maps/map-models.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/maps/map-models.ts @@ -51,7 +51,7 @@ export interface CircleData { export type GenericFunction = (data: FormattedData, dsData: FormattedData[], dsIndex: number) => string; export type MarkerImageFunction = (data: FormattedData, markerImages: string[], dsData: FormattedData[], dsIndex: number) => MarkerImageInfo; -export type PosFunction = (origXPos, origYPos, data: FormattedData, +export type PosFunction = (origXPos: number, origYPos: number, data: FormattedData, dsData: FormattedData[], dsIndex: number, aspect: number) => { x: number, y: number }; export type MarkerIconReadyFunction = (icon: MarkerIconInfo) => void; diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/maps/map-widget.interface.ts b/ui-ngx/src/app/modules/home/components/widget/lib/maps/map-widget.interface.ts index 44ea3cef7c..761584c98f 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/maps/map-widget.interface.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/maps/map-widget.interface.ts @@ -18,9 +18,9 @@ import LeafletMap from '@home/components/widget/lib/maps/leaflet-map'; export interface MapWidgetInterface { map?: LeafletMap; - resize(); - update(); - destroy(); + resize(): void; + update(): void; + destroy(): void; } export interface MapWidgetStaticInterface { diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/maps/map-widget2.ts b/ui-ngx/src/app/modules/home/components/widget/lib/maps/map-widget2.ts index c9e4d872b6..58702653e5 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/maps/map-widget2.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/maps/map-widget2.ts @@ -150,7 +150,7 @@ export class MapWidgetController implements MapWidgetInterface { } setMarkerLocation(e: FormattedData, lat?: number, lng?: number) { - let markerValue; + let markerValue: {[p: string]: any}; if (isDefined(lat) && isDefined(lng)) { const point = lat != null && lng !== null ? L.latLng(lat, lng) : null; markerValue = this.map.convertToCustomFormat(point); @@ -169,7 +169,7 @@ export class MapWidgetController implements MapWidgetInterface { } savePolygonLocation(e: FormattedData, coordinates?: Array) { - let polygonValue; + let polygonValue: {[p: string]: any}; if (isDefined(coordinates)) { polygonValue = this.map.convertToPolygonFormat(coordinates); } else { diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/maps/maps-utils.ts b/ui-ngx/src/app/modules/home/components/widget/lib/maps/maps-utils.ts index aa1a6e3223..125bf4b5c4 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/maps/maps-utils.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/maps/maps-utils.ts @@ -87,14 +87,14 @@ export function isJSON(data: string): boolean { } } -interface labelSettings { +export interface LabelSettings { showLabel: boolean; useLabelFunction: boolean; parsedLabelFunction: GenericFunction; label: string; } -export function entitiesParseName(entities: FormattedData[], labelSettings: labelSettings): FormattedData[] { +export function entitiesParseName(entities: FormattedData[], labelSettings: LabelSettings): FormattedData[] { const div = document.createElement('div'); for (const entity of entities) { if (labelSettings?.showLabel) { diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/maps/markers.ts b/ui-ngx/src/app/modules/home/components/widget/lib/maps/markers.ts index 582faf6ebd..e41928d9e9 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/maps/markers.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/maps/markers.ts @@ -30,7 +30,7 @@ export class Marker { private editing = false; leafletMarker: L.Marker; - labelOffset: L.LatLngTuple; + labelOffset: L.PointTuple; tooltipOffset: L.LatLngTuple; markerOffset: L.LatLngTuple; tooltip: L.Popup; @@ -40,10 +40,10 @@ export class Marker { private location: L.LatLng, private settings: Partial, private data?: FormattedData, - private dataSources?, + private dataSources?: FormattedData[], private onDragendListener?, snappable = false) { - this.leafletMarker = L.marker(location, { + this.leafletMarker = L.marker(this.location, { pmIgnore: !settings.draggableMarker, snapIgnore: !snappable, tbMarkerData: this.data @@ -78,7 +78,7 @@ export class Marker { } if (settings.draggableMarker && onDragendListener) { - this.leafletMarker.on('pm:dragstart', (e) => { + this.leafletMarker.on('pm:dragstart', () => { (this.leafletMarker.dragging as any)._draggable = { _moved: true }; (this.leafletMarker.dragging as any)._enabled = true; this.editing = true; @@ -134,7 +134,7 @@ export class Marker { } } - updateMarkerColor(color) { + updateMarkerColor(color: tinycolor.Instance) { this.createDefaultMarkerIcon(color, (iconInfo) => { this.leafletMarker.setIcon(iconInfo.icon); }); @@ -179,8 +179,8 @@ export class Marker { loadImageWithAspect(this.map.ctx.$injector.get(ImagePipe), currentImage.url).subscribe( (aspectImage) => { if (aspectImage?.aspect) { - let width; - let height; + let width: number; + let height: number; if (aspectImage.aspect > 1) { width = currentImage.size; height = currentImage.size / aspectImage.aspect; @@ -263,7 +263,7 @@ export class Marker { this.leafletMarker.addTo(map))*/ } - extendBoundsWithMarker(bounds) { + extendBoundsWithMarker(bounds: L.LatLngBounds) { bounds.extend(this.leafletMarker.getLatLng()); } @@ -271,7 +271,7 @@ export class Marker { return this.leafletMarker.getLatLng(); } - setMarkerPosition(latLng) { + setMarkerPosition(latLng: L.LatLngExpression) { this.leafletMarker.setLatLng(latLng); } } diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/maps/providers/google-map.ts b/ui-ngx/src/app/modules/home/components/widget/lib/maps/providers/google-map.ts index d19074ddf1..adf68b1dba 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/maps/providers/google-map.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/maps/providers/google-map.ts @@ -31,7 +31,7 @@ interface GmGlobal { export class GoogleMap extends LeafletMap { private resource: ResourcesService; - constructor(ctx: WidgetContext, $container, options: WidgetUnitedMapSettings) { + constructor(ctx: WidgetContext, $container: HTMLElement, options: WidgetUnitedMapSettings) { super(ctx, $container, options); this.resource = ctx.$injector.get(ResourcesService); this.loadGoogle(() => { @@ -47,20 +47,20 @@ export class GoogleMap extends LeafletMap { }, options.gmApiKey); } - private loadGoogle(callback, apiKey = 'AIzaSyDoEx2kaGz3PxwbI9T7ccTSg5xjdw8Nw8Q') { + private loadGoogle(callback: () => void, apiKey = 'AIzaSyDoEx2kaGz3PxwbI9T7ccTSg5xjdw8Nw8Q') { if (gmGlobals[apiKey]) { callback(); } else { - this.resource.loadResource(`https://maps.googleapis.com/maps/api/js?key=${apiKey}`).subscribe( - () => { + this.resource.loadResource(`https://maps.googleapis.com/maps/api/js?key=${apiKey}`).subscribe({ + next: () => { gmGlobals[apiKey] = true; callback(); }, - (error) => { + error: (error) => { gmGlobals[apiKey] = false; console.error(`Google map api load failed!`, error); } - ); + }); } } } diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/maps/providers/here-map.ts b/ui-ngx/src/app/modules/home/components/widget/lib/maps/providers/here-map.ts index 217796464f..8023a1b54f 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/maps/providers/here-map.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/maps/providers/here-map.ts @@ -21,7 +21,7 @@ import { WidgetContext } from '@home/models/widget-component.models'; import { isDefinedAndNotNull } from '@core/utils'; export class HEREMap extends LeafletMap { - constructor(ctx: WidgetContext, $container, options: WidgetUnitedMapSettings) { + constructor(ctx: WidgetContext, $container: HTMLElement, options: WidgetUnitedMapSettings) { super(ctx, $container, options); const map = L.map($container, { doubleClickZoom: !this.options.disableDoubleClickZooming, diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/maps/providers/image-map.ts b/ui-ngx/src/app/modules/home/components/widget/lib/maps/providers/image-map.ts index 1fb33352e7..8cf1822ad5 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/maps/providers/image-map.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/maps/providers/image-map.ts @@ -14,7 +14,7 @@ /// limitations under the License. /// -import L, { LatLngBounds, LatLngLiteral, LatLngTuple } from 'leaflet'; +import L, { LatLngBounds, LatLngLiteral, LatLngTuple, PointExpression } from 'leaflet'; import LeafletMap from '../leaflet-map'; import { CircleData, @@ -24,10 +24,8 @@ import { WidgetUnitedMapSettings } from '../map-models'; import { Observable, of, ReplaySubject, switchMap } from 'rxjs'; -import { catchError, map, mergeMap } from 'rxjs/operators'; -import { - calculateNewPointCoordinate, loadImageWithAspect -} from '@home/components/widget/lib/maps/common-maps-utils'; +import { catchError } from 'rxjs/operators'; +import { calculateNewPointCoordinate, loadImageWithAspect } from '@home/components/widget/lib/maps/common-maps-utils'; import { WidgetContext } from '@home/models/widget-component.models'; import { DataSet, DatasourceType, FormattedData, widgetType } from '@shared/models/widget.models'; import { DataKeyType } from '@shared/models/telemetry/telemetry.models'; @@ -135,7 +133,7 @@ export class ImageMap extends LeafletMap { } } ), - catchError((e) => this.imageFromUrl(defaultImageMapProviderSettings.mapImageUrl)) + catchError(() => this.imageFromUrl(defaultImageMapProviderSettings.mapImageUrl)) ); } @@ -158,13 +156,13 @@ export class ImageMap extends LeafletMap { return this.imageFromUrl(defaultImageMapProviderSettings.mapImageUrl); } }), - catchError((e) => this.imageFromUrl(defaultImageMapProviderSettings.mapImageUrl)) + catchError(() => this.imageFromUrl(defaultImageMapProviderSettings.mapImageUrl)) ); }) ); } - updateBounds(updateImage?: boolean, lastCenterPos?) { + updateBounds(updateImage?: boolean, lastCenterPos?: L.Point) { const w = this.width; const h = this.height; this.southWest = this.pointToLatLng(0, h); @@ -233,7 +231,7 @@ export class ImageMap extends LeafletMap { } } - fitBounds(bounds: LatLngBounds, padding?: LatLngTuple) { } + fitBounds(_bounds: LatLngBounds, _padding?: PointExpression) { } initMap(updateImage?: boolean) { if (!this.map && this.aspect > 0) { @@ -271,7 +269,7 @@ export class ImageMap extends LeafletMap { position.y * this.height); } - convertPosition(data, dsData: FormattedData[]): L.LatLng { + convertPosition(data: FormattedData, dsData: FormattedData[]): L.LatLng { const position = this.extractPosition(data); if (position) { const converted = this.posFunction(position.x, position.y, data, dsData, data.dsIndex, this.aspect) || {x: 0, y: 0}; @@ -296,7 +294,7 @@ export class ImageMap extends LeafletMap { }).filter(el => !!el); } - pointToLatLng(x, y): L.LatLng { + pointToLatLng(x: number, y: number): L.LatLng { return L.CRS.Simple.pointToLatLng({ x, y } as L.PointExpression, maxZoom - 1); } @@ -304,7 +302,7 @@ export class ImageMap extends LeafletMap { return L.CRS.Simple.latLngToPoint(latLng, maxZoom - 1); } - convertToCustomFormat(position: L.LatLng, offset = 0, width = this.width, height = this.height): {[key: string]: any} { + convertToCustomFormat(position: L.LatLng, _offset = 0, width = this.width, height = this.height): {[key: string]: any} { if (!position) { return { [this.options.xPosKeyName]: null, diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/maps/providers/openstreet-map.ts b/ui-ngx/src/app/modules/home/components/widget/lib/maps/providers/openstreet-map.ts index 9c2a85e7c7..5df624f5ea 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/maps/providers/openstreet-map.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/maps/providers/openstreet-map.ts @@ -20,17 +20,17 @@ import { DEFAULT_ZOOM_LEVEL, WidgetUnitedMapSettings } from '../map-models'; import { WidgetContext } from '@home/models/widget-component.models'; export class OpenStreetMap extends LeafletMap { - constructor(ctx: WidgetContext, $container, options: WidgetUnitedMapSettings) { + constructor(ctx: WidgetContext, $container: HTMLElement, options: WidgetUnitedMapSettings) { super(ctx, $container, options); const map = L.map($container, { doubleClickZoom: !this.options.disableDoubleClickZooming, zoomControl: !this.options.disableZoomControl }).setView(options?.parsedDefaultCenterPosition, options?.defaultZoomLevel || DEFAULT_ZOOM_LEVEL); - let tileLayer; + let tileLayer: L.TileLayer; if (options.useCustomProvider) { tileLayer = L.tileLayer(options.customProviderTileUrl); } else { - tileLayer = (L.tileLayer as any).provider(options.mapProvider || 'OpenStreetMap.Mapnik'); + tileLayer = L.tileLayer.provider(options.mapProvider || 'OpenStreetMap.Mapnik'); } tileLayer.addTo(map); super.setMap(map); diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/maps/providers/tencent-map.ts b/ui-ngx/src/app/modules/home/components/widget/lib/maps/providers/tencent-map.ts index 12d5c99557..6ff7f9012b 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/maps/providers/tencent-map.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/maps/providers/tencent-map.ts @@ -21,9 +21,9 @@ import { DEFAULT_ZOOM_LEVEL, WidgetUnitedMapSettings } from '../map-models'; import { WidgetContext } from '@home/models/widget-component.models'; export class TencentMap extends LeafletMap { - constructor(ctx: WidgetContext, $container, options: WidgetUnitedMapSettings) { + constructor(ctx: WidgetContext, $container: HTMLElement, options: WidgetUnitedMapSettings) { super(ctx, $container, options); - const txUrl = 'http://rt{s}.map.gtimg.com/realtimerender?z={z}&x={x}&y={y}&type=vector&style=0'; + const txUrl = 'https://rt{s}.map.gtimg.com/realtimerender?z={z}&x={x}&y={y}&type=vector&style=0'; const map = L.map($container, { doubleClickZoom: !this.options.disableDoubleClickZooming, zoomControl: !this.options.disableZoomControl @@ -31,7 +31,7 @@ export class TencentMap extends LeafletMap { const txLayer = L.tileLayer(txUrl, { subdomains: '0123', tms: true, - attribution: '©2021 Tencent - GS(2020)2236号- Data© NavInfo' + attribution: '©2024 Tencent - GS(2023)1171号' }).addTo(map); txLayer.addTo(map); super.setMap(map); diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/multiple-input-widget.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/multiple-input-widget.component.ts index 02f79f0f3f..7a80f4904a 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/multiple-input-widget.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/multiple-input-widget.component.ts @@ -33,7 +33,7 @@ import { isUndefined } from '@core/utils'; import { EntityType } from '@shared/models/entity-type.models'; -import * as _moment from 'moment'; +import _moment from 'moment'; import { UntypedFormBuilder, UntypedFormGroup, ValidatorFn, Validators } from '@angular/forms'; import { RequestConfig } from '@core/http/http-utils'; import { AttributeService } from '@core/http/attribute.service'; diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/rpc/switch.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/rpc/switch.component.ts index 007eb37929..7b054eae80 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/rpc/switch.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/rpc/switch.component.ts @@ -14,7 +14,7 @@ /// limitations under the License. /// -import { AfterViewInit, Component, ElementRef, Input, OnDestroy, OnInit, ViewChild } from '@angular/core'; +import { AfterViewInit, Component, ElementRef, Input, OnDestroy, ViewChild } from '@angular/core'; import { PageComponent } from '@shared/components/page.component'; import { WidgetContext } from '@home/models/widget-component.models'; import { UtilsService } from '@core/services/utils.service'; @@ -55,11 +55,11 @@ interface SwitchSettings { templateUrl: './switch.component.html', styleUrls: ['./switch.component.scss'] }) -export class SwitchComponent extends PageComponent implements OnInit, AfterViewInit, OnDestroy { +export class SwitchComponent extends PageComponent implements AfterViewInit, OnDestroy { @ViewChild('switch', {static: false}) switchElementRef: ElementRef; @ViewChild('switchContainer', {static: false}) switchContainerRef: ElementRef; - @ViewChild('matSlideToggle', {static: false}) matSlideToggleRef: MatSlideToggle; + @ViewChild('matSlideToggle', {static: false, read: ElementRef}) matSlideToggleRef: ElementRef; @ViewChild('onoffContainer', {static: false}) onoffContainerRef: ElementRef; @ViewChild('onLabel', {static: false}) onLabelRef: ElementRef; @ViewChild('offLabel', {static: false}) offLabelRef: ElementRef; @@ -119,14 +119,11 @@ export class SwitchComponent extends PageComponent implements OnInit, AfterViewI super(store); } - ngOnInit(): void { - } - ngAfterViewInit() { if (this.switchType === 'switch') { this.switchElement = $(this.switchElementRef.nativeElement); this.switchContainer = $(this.switchContainerRef.nativeElement); - this.matSlideToggle = $(this.matSlideToggleRef._elementRef.nativeElement); + this.matSlideToggle = $(this.matSlideToggleRef.nativeElement); this.onoffContainer = $(this.onoffContainerRef.nativeElement); this.onLabel = $(this.onLabelRef.nativeElement); this.offLabel = $(this.offLabelRef.nativeElement); diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/settings/common/chart/time-series-chart-axis-settings.component.html b/ui-ngx/src/app/modules/home/components/widget/lib/settings/common/chart/time-series-chart-axis-settings.component.html index 7ee338bf21..49e0b9eab2 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/settings/common/chart/time-series-chart-axis-settings.component.html +++ b/ui-ngx/src/app/modules/home/components/widget/lib/settings/common/chart/time-series-chart-axis-settings.component.html @@ -17,7 +17,7 @@ -->
- diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/settings/common/data-key-input.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/settings/common/data-key-input.component.ts index 47d093be54..e08ec36d8d 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/settings/common/data-key-input.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/settings/common/data-key-input.component.ts @@ -194,7 +194,7 @@ export class DataKeyInputComponent implements ControlValueAccessor, OnInit, OnCh } }), filter((value) => typeof value === 'string'), - map((value) => value ? (typeof value === 'string' ? value : value.name) : ''), + map((value) => value ? value : ''), mergeMap(name => this.fetchKeys(name) ), share() ); diff --git a/ui-ngx/src/app/modules/home/components/widget/widget-component.service.ts b/ui-ngx/src/app/modules/home/components/widget/widget-component.service.ts index 8e1e6f1b3a..80ab61df67 100644 --- a/ui-ngx/src/app/modules/home/components/widget/widget-component.service.ts +++ b/ui-ngx/src/app/modules/home/components/widget/widget-component.service.ts @@ -14,7 +14,7 @@ /// limitations under the License. /// -import { ComponentFactory, Inject, Injectable, Optional, Type } from '@angular/core'; +import { Inject, Injectable, Optional, Type } from '@angular/core'; import { DynamicComponentFactoryService } from '@core/services/dynamic-component-factory.service'; import { WidgetService } from '@core/http/widget.service'; import { forkJoin, from, Observable, of, ReplaySubject, Subject, throwError } from 'rxjs'; @@ -28,7 +28,13 @@ import { } from '@home/models/widget-component.models'; import cssjs from '@core/css/css'; import { UtilsService } from '@core/services/utils.service'; -import { ModulesWithFactories, ResourcesService } from '@core/services/resources.service'; +import { + componentTypeBySelector, + flatModulesWithComponents, + ModulesWithComponents, + modulesWithComponentsToTypes, + ResourcesService +} from '@core/services/resources.service'; import { IWidgetSettingsComponent, Widget, @@ -55,7 +61,6 @@ import { HOME_COMPONENTS_MODULE_TOKEN } from '@home/components/tokens'; import { widgetSettingsComponentsMap } from '@home/components/widget/lib/settings/widget-settings.module'; import { basicWidgetConfigComponentsMap } from '@home/components/widget/config/basic/basic-widget-config.module'; import { IBasicWidgetConfigComponent } from '@home/components/widget/config/widget-config.component.models'; -import { TbTimeSeriesChart } from '@home/components/widget/lib/chart/time-series-chart'; @Injectable() export class WidgetComponentService { @@ -323,12 +328,12 @@ export class WidgetComponentService { this.cssParser.cssPreviewNamespace = widgetNamespace; this.cssParser.createStyleElement(widgetNamespace, widgetInfo.templateCss); const resourceTasks: Observable[] = []; - const modulesTasks: Observable[] = []; + const modulesTasks: Observable[] = []; if (widgetInfo.resources.length > 0) { widgetInfo.resources.filter(r => r.isModule).forEach( (resource) => { modulesTasks.push( - this.resources.loadFactories(resource.url, this.modulesMap).pipe( + this.resources.loadModulesWithComponents(resource.url, this.modulesMap).pipe( catchError((e: Error) => of(e?.message ? e.message : `Failed to load widget resource module: '${resource.url}'`)) ) ); @@ -345,7 +350,7 @@ export class WidgetComponentService { } ); - let modulesObservable: Observable; + let modulesObservable: Observable; if (modulesTasks.length) { modulesObservable = forkJoin(modulesTasks).pipe( map(res => { @@ -353,20 +358,13 @@ export class WidgetComponentService { if (msg) { return msg as string; } else { - const modulesWithFactoriesList = res as ModulesWithFactories[]; - const resModulesWithFactories: ModulesWithFactories = { - modules: modulesWithFactoriesList.map(mf => mf.modules).flat(), - factories: modulesWithFactoriesList.map(mf => mf.factories).flat() - }; - if (modules && modules.length) { - resModulesWithFactories.modules = resModulesWithFactories.modules.concat(modules); - } - return resModulesWithFactories; + const modulesWithComponentsList = res as ModulesWithComponents[]; + return flatModulesWithComponents(modulesWithComponentsList); } }) ); } else { - modulesObservable = modules && modules.length ? of({modules, factories: []}) : of({modules: [], factories: []}); + modulesObservable = of({modules: [], standaloneComponents: []}); } resourceTasks.push( @@ -375,11 +373,15 @@ export class WidgetComponentService { if (typeof resolvedModules === 'string') { return of(resolvedModules); } else { - this.registerWidgetSettingsForms(widgetInfo, resolvedModules.factories); + this.registerWidgetSettingsForms(widgetInfo, resolvedModules); + let imports = modulesWithComponentsToTypes(resolvedModules); + if (modules && modules.length) { + imports = imports.concat(modules); + } return this.dynamicComponentFactoryService.createDynamicComponent( class DynamicWidgetComponentInstance extends DynamicWidgetComponent {}, widgetInfo.templateHtml, - resolvedModules.modules + imports ).pipe( map((componentType) => { widgetInfo.componentType = componentType; @@ -401,7 +403,7 @@ export class WidgetComponentService { errors = msgs.filter(msg => msg && msg.length > 0); } if (errors && errors.length) { - return throwError(errors); + return throwError(() => errors); } else { return of(null); } @@ -409,7 +411,7 @@ export class WidgetComponentService { )); } - private registerWidgetSettingsForms(widgetInfo: WidgetInfo, factories: ComponentFactory[]) { + private registerWidgetSettingsForms(widgetInfo: WidgetInfo, modulesWithComponents: ModulesWithComponents) { const directives: string[] = []; const basicDirectives: string[] = []; if (widgetInfo.settingsDirective && widgetInfo.settingsDirective.length) { @@ -425,17 +427,19 @@ export class WidgetComponentService { basicDirectives.push(widgetInfo.basicModeDirective); } - this.expandSettingComponentMap(widgetSettingsComponentsMap, directives, factories); - this.expandSettingComponentMap(basicWidgetConfigComponentsMap, basicDirectives, factories); + this.expandSettingComponentMap(widgetSettingsComponentsMap, directives, modulesWithComponents); + this.expandSettingComponentMap(basicWidgetConfigComponentsMap, basicDirectives, modulesWithComponents); } private expandSettingComponentMap(settingsComponentsMap: {[key: string]: Type}, - directives: string[], factories: ComponentFactory[]): void { + directives: string[], modulesWithComponents: ModulesWithComponents): void { if (directives.length) { - factories.filter((factory) => directives.includes(factory.selector)) - .forEach((foundFactory) => { - settingsComponentsMap[foundFactory.selector] = foundFactory.componentType; - }); + directives.forEach(selector => { + const compType = componentTypeBySelector(modulesWithComponents, selector); + if (compType) { + settingsComponentsMap[selector] = compType; + } + }); } } diff --git a/ui-ngx/src/app/modules/home/components/widget/widget-config.component.ts b/ui-ngx/src/app/modules/home/components/widget/widget-config.component.ts index 735212c2b3..6be327290d 100644 --- a/ui-ngx/src/app/modules/home/components/widget/widget-config.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/widget-config.component.ts @@ -17,7 +17,6 @@ import { ChangeDetectorRef, Component, - ComponentFactoryResolver, ComponentRef, forwardRef, Input, @@ -212,7 +211,6 @@ export class WidgetConfigComponent extends PageComponent implements OnInit, OnDe private entityService: EntityService, private dialog: MatDialog, public translate: TranslateService, - private cfr: ComponentFactoryResolver, private fb: UntypedFormBuilder, private cd: ChangeDetectorRef) { super(store); @@ -444,10 +442,9 @@ export class WidgetConfigComponent extends PageComponent implements OnInit, OnDe this.basicModeDirectiveError = this.translate.instant('widget-config.settings-component-not-found', {selector: this.modelValue.basicModeDirective}); } else { - const factory = this.cfr.resolveComponentFactory(componentType); this.createBasicModeComponentTimeout = setTimeout(() => { this.createBasicModeComponentTimeout = null; - this.basicModeComponentRef = this.basicModeContainer.createComponent(factory); + this.basicModeComponentRef = this.basicModeContainer.createComponent(componentType); this.basicModeComponent = this.basicModeComponentRef.instance; this.basicModeComponent.isAdd = isAdd; this.basicModeComponent.widgetConfig = this.modelValue; diff --git a/ui-ngx/src/app/modules/home/components/widget/widget.component.ts b/ui-ngx/src/app/modules/home/components/widget/widget.component.ts index b58e9fe85b..9ff7f24568 100644 --- a/ui-ngx/src/app/modules/home/components/widget/widget.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/widget.component.ts @@ -15,7 +15,6 @@ /// import { - AfterViewInit, ChangeDetectionStrategy, ChangeDetectorRef, Component, @@ -39,7 +38,8 @@ import { } from '@angular/core'; import { DashboardWidget } from '@home/models/dashboard-component.models'; import { - Widget, WidgetAction, + Widget, + WidgetAction, WidgetActionDescriptor, widgetActionSources, WidgetActionType, @@ -57,7 +57,8 @@ import { WidgetService } from '@core/http/widget.service'; import { UtilsService } from '@core/services/utils.service'; import { forkJoin, Observable, of, ReplaySubject, Subscription, throwError } from 'rxjs'; import { - deepClone, guid, + deepClone, + guid, insertVariable, isDefined, isNotEmptyStr, @@ -87,7 +88,12 @@ import { import { EntityId } from '@shared/models/id/entity-id'; import { ActivatedRoute, Router } from '@angular/router'; import cssjs from '@core/css/css'; -import { ModulesWithFactories, ResourcesService } from '@core/services/resources.service'; +import { + flatModulesWithComponents, + ModulesWithComponents, + modulesWithComponentsToTypes, + ResourcesService +} from '@core/services/resources.service'; import { catchError, map, switchMap } from 'rxjs/operators'; import { ActionNotificationShow } from '@core/notification/notification.actions'; import { TimeService } from '@core/services/time.service'; @@ -122,7 +128,7 @@ import { DashboardUtilsService } from '@core/services/dashboard-utils.service'; encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush }) -export class WidgetComponent extends PageComponent implements OnInit, AfterViewInit, OnChanges, OnDestroy { +export class WidgetComponent extends PageComponent implements OnInit, OnChanges, OnDestroy { @Input() widgetTitlePanel: TemplateRef; @@ -326,9 +332,6 @@ export class WidgetComponent extends PageComponent implements OnInit, AfterViewI } } - ngAfterViewInit(): void { - } - ngOnChanges(changes: SimpleChanges): void { for (const propName of Object.keys(changes)) { const change = changes[propName]; @@ -1129,7 +1132,7 @@ export class WidgetComponent extends PageComponent implements OnInit, AfterViewI } const customActionPrettyFunction = new Function('$event', 'widgetContext', 'entityId', 'entityName', 'htmlTemplate', 'additionalParams', 'entityLabel', customPrettyFunction); - this.widgetContext.customDialog.setAdditionalModules(descriptor.customModules); + this.widgetContext.customDialog.setAdditionalImports(descriptor.customImports); customActionPrettyFunction($event, this.widgetContext, entityId, entityName, htmlTemplate, additionalParams, entityLabel); } catch (e) { console.error(e); @@ -1459,7 +1462,7 @@ export class WidgetComponent extends PageComponent implements OnInit, AfterViewI private loadCustomActionResources(actionNamespace: string, customCss: string, customResources: Array, actionDescriptor: WidgetAction): Observable { const resourceTasks: Observable[] = []; - const modulesTasks: Observable[] = []; + const modulesTasks: Observable[] = []; if (isDefined(customCss) && customCss.length > 0) { this.cssParser.cssPreviewNamespace = actionNamespace; @@ -1470,7 +1473,7 @@ export class WidgetComponent extends PageComponent implements OnInit, AfterViewI customResources.forEach(resource => { if (resource.isModule) { modulesTasks.push( - this.resources.loadFactories(resource.url, this.modulesMap).pipe( + this.resources.loadModulesWithComponents(resource.url, this.modulesMap).pipe( catchError((e: Error) => of(e?.message ? e.message : `Failed to load custom action resource module: '${resource.url}'`)) ) ); @@ -1484,28 +1487,24 @@ export class WidgetComponent extends PageComponent implements OnInit, AfterViewI }); if (modulesTasks.length) { - const modulesObservable: Observable[]> = forkJoin(modulesTasks).pipe( + const importsObservable: Observable[]> = forkJoin(modulesTasks).pipe( map(res => { const msg = res.find(r => typeof r === 'string'); if (msg) { return msg as string; } else { - const modulesWithFactoriesList = res as ModulesWithFactories[]; - const resModulesWithFactories: ModulesWithFactories = { - modules: modulesWithFactoriesList.map(mf => mf.modules).flat(), - factories: modulesWithFactoriesList.map(mf => mf.factories).flat() - }; - return resModulesWithFactories.modules; + const modulesWithComponents = flatModulesWithComponents(res as ModulesWithComponents[]); + return modulesWithComponentsToTypes(modulesWithComponents); } }) ); - resourceTasks.push(modulesObservable.pipe( - map((resolvedModules) => { - if (typeof resolvedModules === 'string') { - return resolvedModules; + resourceTasks.push(importsObservable.pipe( + map((resolvedImports) => { + if (typeof resolvedImports === 'string') { + return resolvedImports; } else { - actionDescriptor.customModules = resolvedModules; + actionDescriptor.customImports = resolvedImports; return null; } }))); diff --git a/ui-ngx/src/app/modules/home/pages/admin/admin-routing.module.ts b/ui-ngx/src/app/modules/home/pages/admin/admin-routing.module.ts index 7127d98723..43a2c588c2 100644 --- a/ui-ngx/src/app/modules/home/pages/admin/admin-routing.module.ts +++ b/ui-ngx/src/app/modules/home/pages/admin/admin-routing.module.ts @@ -15,15 +15,7 @@ /// import { inject, NgModule } from '@angular/core'; -import { - ActivatedRouteSnapshot, - Resolve, - ResolveFn, - Router, - RouterModule, - RouterStateSnapshot, - Routes -} from '@angular/router'; +import { ActivatedRouteSnapshot, ResolveFn, Router, RouterModule, RouterStateSnapshot, Routes } from '@angular/router'; import { MailServerComponent } from '@modules/home/pages/admin/mail-server.component'; import { ConfirmOnExitGuard } from '@core/guards/confirm-on-exit.guard'; diff --git a/ui-ngx/src/app/modules/home/pages/admin/mail-server.component.scss b/ui-ngx/src/app/modules/home/pages/admin/mail-server.component.scss index 45e438e878..b87c58bc48 100644 --- a/ui-ngx/src/app/modules/home/pages/admin/mail-server.component.scss +++ b/ui-ngx/src/app/modules/home/pages/admin/mail-server.component.scss @@ -97,6 +97,9 @@ line-height: 24px; font-size: 16px; font-weight: 500; + .mat-pseudo-checkbox { + display: none; + } } .mat-button-toggle-checked.mat-button-toggle-appearance-standard:not(.mat-button-toggle-disabled):hover .mat-button-toggle-focus-overlay { diff --git a/ui-ngx/src/app/modules/home/pages/admin/oauth2/clients/clients-table-config.resolver.ts b/ui-ngx/src/app/modules/home/pages/admin/oauth2/clients/clients-table-config.resolver.ts index a5993bc773..9f009bc54b 100644 --- a/ui-ngx/src/app/modules/home/pages/admin/oauth2/clients/clients-table-config.resolver.ts +++ b/ui-ngx/src/app/modules/home/pages/admin/oauth2/clients/clients-table-config.resolver.ts @@ -15,7 +15,7 @@ /// import { Injectable } from '@angular/core'; -import { Resolve } from '@angular/router'; + import { DateEntityTableColumn, EntityTableColumn, @@ -37,7 +37,7 @@ import { Direction } from '@shared/models/page/sort-order'; import { PageLink } from '@shared/models/page/page-link'; @Injectable() -export class ClientsTableConfigResolver implements Resolve> { +export class ClientsTableConfigResolver { private readonly config: EntityTableConfig = new EntityTableConfig(); diff --git a/ui-ngx/src/app/modules/home/pages/admin/oauth2/domains/domain-table-config.resolver.ts b/ui-ngx/src/app/modules/home/pages/admin/oauth2/domains/domain-table-config.resolver.ts index 5e2cb5f9ad..1359f24893 100644 --- a/ui-ngx/src/app/modules/home/pages/admin/oauth2/domains/domain-table-config.resolver.ts +++ b/ui-ngx/src/app/modules/home/pages/admin/oauth2/domains/domain-table-config.resolver.ts @@ -15,7 +15,7 @@ /// import { Injectable } from '@angular/core'; -import { ActivatedRouteSnapshot, Resolve } from '@angular/router'; +import { ActivatedRouteSnapshot } from '@angular/router'; import { DateEntityTableColumn, EntityActionTableColumn, @@ -36,7 +36,7 @@ import { Direction } from '@app/shared/models/page/sort-order'; import { map, Observable, of, mergeMap } from 'rxjs'; @Injectable() -export class DomainTableConfigResolver implements Resolve> { +export class DomainTableConfigResolver { private readonly config: EntityTableConfig = new EntityTableConfig(); diff --git a/ui-ngx/src/app/modules/home/pages/admin/oauth2/mobile-apps/mobile-app-table-config.resolver.ts b/ui-ngx/src/app/modules/home/pages/admin/oauth2/mobile-apps/mobile-app-table-config.resolver.ts index 072fac02c4..1f81196d11 100644 --- a/ui-ngx/src/app/modules/home/pages/admin/oauth2/mobile-apps/mobile-app-table-config.resolver.ts +++ b/ui-ngx/src/app/modules/home/pages/admin/oauth2/mobile-apps/mobile-app-table-config.resolver.ts @@ -15,7 +15,7 @@ /// import { Injectable } from '@angular/core'; -import { ActivatedRouteSnapshot, Resolve } from '@angular/router'; +import { ActivatedRouteSnapshot } from '@angular/router'; import { CellActionDescriptorType, DateEntityTableColumn, @@ -36,7 +36,7 @@ import { MobileAppTableHeaderComponent } from '@home/pages/admin/oauth2/mobile-a import { map, Observable, of, mergeMap } from 'rxjs'; @Injectable() -export class MobileAppTableConfigResolver implements Resolve> { +export class MobileAppTableConfigResolver { private readonly config: EntityTableConfig = new EntityTableConfig(); diff --git a/ui-ngx/src/app/modules/home/pages/admin/oauth2/oauth2-routing.module.ts b/ui-ngx/src/app/modules/home/pages/admin/oauth2/oauth2-routing.module.ts index 22c172ca14..cba52e977c 100644 --- a/ui-ngx/src/app/modules/home/pages/admin/oauth2/oauth2-routing.module.ts +++ b/ui-ngx/src/app/modules/home/pages/admin/oauth2/oauth2-routing.module.ts @@ -15,7 +15,7 @@ /// import { Injectable, NgModule } from '@angular/core'; -import { Resolve, RouterModule, Routes } from '@angular/router'; +import { RouterModule, Routes } from '@angular/router'; import { RouterTabsComponent } from '@home/components/router-tabs.component'; import { Authority } from '@shared/models/authority.enum'; import { EntitiesTableComponent } from '@home/components/entity/entities-table.component'; @@ -30,7 +30,7 @@ import { MobileAppTableConfigResolver } from '@home/pages/admin/oauth2/mobile-ap import { MenuId } from '@core/services/menu.models'; @Injectable() -export class OAuth2LoginProcessingUrlResolver implements Resolve { +export class OAuth2LoginProcessingUrlResolver { constructor(private oauth2Service: OAuth2Service) { } diff --git a/ui-ngx/src/app/modules/home/pages/admin/queue/queues-table-config.resolver.ts b/ui-ngx/src/app/modules/home/pages/admin/queue/queues-table-config.resolver.ts index 3bd63e1945..1a3fa0f8d7 100644 --- a/ui-ngx/src/app/modules/home/pages/admin/queue/queues-table-config.resolver.ts +++ b/ui-ngx/src/app/modules/home/pages/admin/queue/queues-table-config.resolver.ts @@ -15,7 +15,7 @@ /// import { Injectable } from '@angular/core'; -import { ActivatedRouteSnapshot, Resolve, Router } from '@angular/router'; +import { ActivatedRouteSnapshot, Router } from '@angular/router'; import { EntityTableColumn, EntityTableConfig } from '@home/models/entity/entities-table-config.models'; import { QueueInfo, @@ -39,7 +39,7 @@ import { selectAuthUser } from '@core/auth/auth.selectors'; import { EntityAction } from '@home/models/entity/entity-component.models'; @Injectable() -export class QueuesTableConfigResolver implements Resolve> { +export class QueuesTableConfigResolver { readonly queueType = ServiceType.TB_RULE_ENGINE; diff --git a/ui-ngx/src/app/modules/home/pages/admin/resource/resources-library-table-config.resolve.ts b/ui-ngx/src/app/modules/home/pages/admin/resource/resources-library-table-config.resolve.ts index 66a704996b..82a599b0a8 100644 --- a/ui-ngx/src/app/modules/home/pages/admin/resource/resources-library-table-config.resolve.ts +++ b/ui-ngx/src/app/modules/home/pages/admin/resource/resources-library-table-config.resolve.ts @@ -21,7 +21,7 @@ import { EntityTableColumn, EntityTableConfig } from '@home/models/entity/entities-table-config.models'; -import { Resolve, Router } from '@angular/router'; +import { Router } from '@angular/router'; import { Resource, ResourceInfo, ResourceType, ResourceTypeTranslationMap } from '@shared/models/resource.models'; import { EntityType, entityTypeResources, entityTypeTranslations } from '@shared/models/entity-type.models'; import { NULL_UUID } from '@shared/models/id/has-uuid'; @@ -39,7 +39,7 @@ import { map } from 'rxjs/operators'; import { ResourcesTableHeaderComponent } from '@home/pages/admin/resource/resources-table-header.component'; @Injectable() -export class ResourcesLibraryTableConfigResolver implements Resolve> { +export class ResourcesLibraryTableConfigResolver { private readonly config: EntityTableConfig = new EntityTableConfig(); private readonly resourceTypesTranslationMap = ResourceTypeTranslationMap; diff --git a/ui-ngx/src/app/modules/home/pages/alarm/alarm-routing.module.ts b/ui-ngx/src/app/modules/home/pages/alarm/alarm-routing.module.ts index 3ada68643f..e9ca831fb9 100644 --- a/ui-ngx/src/app/modules/home/pages/alarm/alarm-routing.module.ts +++ b/ui-ngx/src/app/modules/home/pages/alarm/alarm-routing.module.ts @@ -15,7 +15,7 @@ /// import { Injectable, NgModule } from '@angular/core'; -import { Resolve, RouterModule, Routes } from '@angular/router'; +import { RouterModule, Routes } from '@angular/router'; import { Authority } from '@shared/models/authority.enum'; import { Observable } from 'rxjs'; import { OAuth2Service } from '@core/http/oauth2.service'; @@ -24,7 +24,7 @@ import { AlarmsMode } from '@shared/models/alarm.models'; import { MenuId } from '@core/services/menu.models'; @Injectable() -export class OAuth2LoginProcessingUrlResolver implements Resolve { +export class OAuth2LoginProcessingUrlResolver { constructor(private oauth2Service: OAuth2Service) { } diff --git a/ui-ngx/src/app/modules/home/pages/asset-profile/asset-profiles-table-config.resolver.ts b/ui-ngx/src/app/modules/home/pages/asset-profile/asset-profiles-table-config.resolver.ts index d9eb000e0f..75463ed871 100644 --- a/ui-ngx/src/app/modules/home/pages/asset-profile/asset-profiles-table-config.resolver.ts +++ b/ui-ngx/src/app/modules/home/pages/asset-profile/asset-profiles-table-config.resolver.ts @@ -15,7 +15,7 @@ /// import { Injectable } from '@angular/core'; -import { Resolve, Router } from '@angular/router'; +import { Router } from '@angular/router'; import { checkBoxCell, DateEntityTableColumn, @@ -37,7 +37,7 @@ import { AssetProfileComponent } from '@home/components/profile/asset-profile.co import { AssetProfileTabsComponent } from './asset-profile-tabs.component'; @Injectable() -export class AssetProfilesTableConfigResolver implements Resolve> { +export class AssetProfilesTableConfigResolver { private readonly config: EntityTableConfig = new EntityTableConfig(); diff --git a/ui-ngx/src/app/modules/home/pages/asset/assets-table-config.resolver.ts b/ui-ngx/src/app/modules/home/pages/asset/assets-table-config.resolver.ts index 1c23eeb130..3ce73455c4 100644 --- a/ui-ngx/src/app/modules/home/pages/asset/assets-table-config.resolver.ts +++ b/ui-ngx/src/app/modules/home/pages/asset/assets-table-config.resolver.ts @@ -16,7 +16,7 @@ import { Injectable } from '@angular/core'; -import { ActivatedRouteSnapshot, Resolve, Router } from '@angular/router'; +import { ActivatedRouteSnapshot, Router } from '@angular/router'; import { CellActionDescriptor, checkBoxCell, @@ -65,7 +65,7 @@ import { } from '@home/dialogs/add-entities-to-edge-dialog.component'; @Injectable() -export class AssetsTableConfigResolver implements Resolve> { +export class AssetsTableConfigResolver { private readonly config: EntityTableConfig = new EntityTableConfig(); diff --git a/ui-ngx/src/app/modules/home/pages/customer/customers-table-config.resolver.ts b/ui-ngx/src/app/modules/home/pages/customer/customers-table-config.resolver.ts index ee925e54a0..df37a7204f 100644 --- a/ui-ngx/src/app/modules/home/pages/customer/customers-table-config.resolver.ts +++ b/ui-ngx/src/app/modules/home/pages/customer/customers-table-config.resolver.ts @@ -16,7 +16,7 @@ import { Injectable } from '@angular/core'; -import { Resolve, Router } from '@angular/router'; +import { Router } from '@angular/router'; import { DateEntityTableColumn, @@ -37,7 +37,7 @@ import { AppState } from '@core/core.state'; import { HomeDialogsService } from '@home/dialogs/home-dialogs.service'; @Injectable() -export class CustomersTableConfigResolver implements Resolve> { +export class CustomersTableConfigResolver { private readonly config: EntityTableConfig = new EntityTableConfig(); diff --git a/ui-ngx/src/app/modules/home/pages/dashboard/dashboard-routing.module.ts b/ui-ngx/src/app/modules/home/pages/dashboard/dashboard-routing.module.ts index 28fc9d4e12..392f550cbe 100644 --- a/ui-ngx/src/app/modules/home/pages/dashboard/dashboard-routing.module.ts +++ b/ui-ngx/src/app/modules/home/pages/dashboard/dashboard-routing.module.ts @@ -15,7 +15,7 @@ /// import { Injectable, NgModule } from '@angular/core'; -import { ActivatedRouteSnapshot, Resolve, RouterModule, Routes } from '@angular/router'; +import { ActivatedRouteSnapshot, RouterModule, Routes } from '@angular/router'; import { EntitiesTableComponent } from '../../components/entity/entities-table.component'; import { Authority } from '@shared/models/authority.enum'; @@ -36,7 +36,7 @@ import { ConfirmOnExitGuard } from '@core/guards/confirm-on-exit.guard'; import { MenuId } from '@core/services/menu.models'; @Injectable() -export class DashboardResolver implements Resolve { +export class DashboardResolver { constructor(private store: Store, private dashboardService: DashboardService, diff --git a/ui-ngx/src/app/modules/home/pages/dashboard/dashboards-table-config.resolver.ts b/ui-ngx/src/app/modules/home/pages/dashboard/dashboards-table-config.resolver.ts index 2ee7df8835..ac280f2374 100644 --- a/ui-ngx/src/app/modules/home/pages/dashboard/dashboards-table-config.resolver.ts +++ b/ui-ngx/src/app/modules/home/pages/dashboard/dashboards-table-config.resolver.ts @@ -16,7 +16,7 @@ import { Injectable } from '@angular/core'; -import { ActivatedRouteSnapshot, Resolve, Router } from '@angular/router'; +import { ActivatedRouteSnapshot, Router } from '@angular/router'; import { CellActionDescriptor, checkBoxCell, @@ -79,7 +79,7 @@ import { } from '@home/components/alias/entity-aliases-dialog.component'; @Injectable() -export class DashboardsTableConfigResolver implements Resolve> { +export class DashboardsTableConfigResolver { private readonly config: EntityTableConfig = new EntityTableConfig(); diff --git a/ui-ngx/src/app/modules/home/pages/device-profile/device-profiles-table-config.resolver.ts b/ui-ngx/src/app/modules/home/pages/device-profile/device-profiles-table-config.resolver.ts index 5fa1afe984..2746dbd5f3 100644 --- a/ui-ngx/src/app/modules/home/pages/device-profile/device-profiles-table-config.resolver.ts +++ b/ui-ngx/src/app/modules/home/pages/device-profile/device-profiles-table-config.resolver.ts @@ -15,7 +15,7 @@ /// import { Injectable } from '@angular/core'; -import { Resolve, Router } from '@angular/router'; +import { Router } from '@angular/router'; import { checkBoxCell, DateEntityTableColumn, @@ -45,7 +45,7 @@ import { ImportExportService } from '@shared/import-export/import-export.service import { HomeDialogsService } from '@home/dialogs/home-dialogs.service'; @Injectable() -export class DeviceProfilesTableConfigResolver implements Resolve> { +export class DeviceProfilesTableConfigResolver { private readonly config: EntityTableConfig = new EntityTableConfig(); diff --git a/ui-ngx/src/app/modules/home/pages/device/devices-table-config.resolver.ts b/ui-ngx/src/app/modules/home/pages/device/devices-table-config.resolver.ts index 645b2a6d53..d12e710541 100644 --- a/ui-ngx/src/app/modules/home/pages/device/devices-table-config.resolver.ts +++ b/ui-ngx/src/app/modules/home/pages/device/devices-table-config.resolver.ts @@ -16,7 +16,7 @@ import { Injectable } from '@angular/core'; -import { ActivatedRoute, ActivatedRouteSnapshot, Resolve, Router } from '@angular/router'; +import { ActivatedRoute, ActivatedRouteSnapshot, Router } from '@angular/router'; import { CellActionDescriptor, checkBoxCell, @@ -91,7 +91,7 @@ interface DevicePageQueryParams extends PageQueryParam { } @Injectable() -export class DevicesTableConfigResolver implements Resolve> { +export class DevicesTableConfigResolver { private readonly config: EntityTableConfig = new EntityTableConfig(); diff --git a/ui-ngx/src/app/modules/home/pages/edge/edges-table-config.resolver.ts b/ui-ngx/src/app/modules/home/pages/edge/edges-table-config.resolver.ts index fe54614c9a..efdc8c715c 100644 --- a/ui-ngx/src/app/modules/home/pages/edge/edges-table-config.resolver.ts +++ b/ui-ngx/src/app/modules/home/pages/edge/edges-table-config.resolver.ts @@ -16,7 +16,7 @@ import { Injectable } from '@angular/core'; -import { ActivatedRouteSnapshot, Resolve, Router } from '@angular/router'; +import { ActivatedRouteSnapshot, Router } from '@angular/router'; import { CellActionDescriptor, checkBoxCell, @@ -65,7 +65,7 @@ import { import { AddEntityDialogComponent } from '@home/components/entity/add-entity-dialog.component'; @Injectable() -export class EdgesTableConfigResolver implements Resolve> { +export class EdgesTableConfigResolver { private readonly config: EntityTableConfig = new EntityTableConfig(); private customerId: string; diff --git a/ui-ngx/src/app/modules/home/pages/entity-view/entity-views-table-config.resolver.ts b/ui-ngx/src/app/modules/home/pages/entity-view/entity-views-table-config.resolver.ts index fc225cad69..3757189a13 100644 --- a/ui-ngx/src/app/modules/home/pages/entity-view/entity-views-table-config.resolver.ts +++ b/ui-ngx/src/app/modules/home/pages/entity-view/entity-views-table-config.resolver.ts @@ -16,7 +16,7 @@ import { Injectable } from '@angular/core'; -import { ActivatedRouteSnapshot, Resolve, Router } from '@angular/router'; +import { ActivatedRouteSnapshot, Router } from '@angular/router'; import { CellActionDescriptor, checkBoxCell, @@ -63,7 +63,7 @@ import { } from '@home/dialogs/add-entities-to-edge-dialog.component'; @Injectable() -export class EntityViewsTableConfigResolver implements Resolve> { +export class EntityViewsTableConfigResolver { private readonly config: EntityTableConfig = new EntityTableConfig(); diff --git a/ui-ngx/src/app/modules/home/pages/notification/inbox/inbox-table-config.resolver.ts b/ui-ngx/src/app/modules/home/pages/notification/inbox/inbox-table-config.resolver.ts index aa383a3bf8..824529cf15 100644 --- a/ui-ngx/src/app/modules/home/pages/notification/inbox/inbox-table-config.resolver.ts +++ b/ui-ngx/src/app/modules/home/pages/notification/inbox/inbox-table-config.resolver.ts @@ -38,11 +38,11 @@ import { InboxNotificationDialogData } from '@home/pages/notification/inbox/inbox-notification-dialog.component'; import { Injectable } from '@angular/core'; -import { ActivatedRouteSnapshot, Resolve } from '@angular/router'; +import { ActivatedRouteSnapshot } from '@angular/router'; import { UtilsService } from '@core/services/utils.service'; @Injectable() -export class InboxTableConfigResolver implements Resolve> { +export class InboxTableConfigResolver { private readonly config: EntityTableConfig = new EntityTableConfig(); diff --git a/ui-ngx/src/app/modules/home/pages/notification/inbox/inbox-table-header.component.scss b/ui-ngx/src/app/modules/home/pages/notification/inbox/inbox-table-header.component.scss index 1ca0f9a72f..af69f47306 100644 --- a/ui-ngx/src/app/modules/home/pages/notification/inbox/inbox-table-header.component.scss +++ b/ui-ngx/src/app/modules/home/pages/notification/inbox/inbox-table-header.component.scss @@ -63,6 +63,9 @@ font-size: 14px; font-weight: 500; letter-spacing: .25px; + .mat-pseudo-checkbox { + display: none; + } } .mat-button-toggle-checked.mat-button-toggle-appearance-standard:not(.mat-button-toggle-disabled):hover .mat-button-toggle-focus-overlay { diff --git a/ui-ngx/src/app/modules/home/pages/notification/recipient/recipient-table-config.resolver.ts b/ui-ngx/src/app/modules/home/pages/notification/recipient/recipient-table-config.resolver.ts index 82e7c954fd..23368b4584 100644 --- a/ui-ngx/src/app/modules/home/pages/notification/recipient/recipient-table-config.resolver.ts +++ b/ui-ngx/src/app/modules/home/pages/notification/recipient/recipient-table-config.resolver.ts @@ -32,12 +32,12 @@ import { import { MatDialog } from '@angular/material/dialog'; import { EntityAction } from '@home/models/entity/entity-component.models'; import { RecipientTableHeaderComponent } from '@home/pages/notification/recipient/recipient-table-header.component'; -import { ActivatedRouteSnapshot, Resolve } from '@angular/router'; +import { ActivatedRouteSnapshot } from '@angular/router'; import { Injectable } from '@angular/core'; import { DatePipe } from '@angular/common'; @Injectable() -export class RecipientTableConfigResolver implements Resolve> { +export class RecipientTableConfigResolver { private readonly config: EntityTableConfig = new EntityTableConfig(); diff --git a/ui-ngx/src/app/modules/home/pages/notification/rule/rule-table-config.resolver.ts b/ui-ngx/src/app/modules/home/pages/notification/rule/rule-table-config.resolver.ts index cc68cb5411..1a0ec93953 100644 --- a/ui-ngx/src/app/modules/home/pages/notification/rule/rule-table-config.resolver.ts +++ b/ui-ngx/src/app/modules/home/pages/notification/rule/rule-table-config.resolver.ts @@ -32,12 +32,12 @@ import { RuleNotificationDialogComponent, RuleNotificationDialogData } from '@home/pages/notification/rule/rule-notification-dialog.component'; -import { ActivatedRouteSnapshot, Resolve } from '@angular/router'; +import { ActivatedRouteSnapshot } from '@angular/router'; import { Injectable } from '@angular/core'; import { DatePipe } from '@angular/common'; @Injectable() -export class RuleTableConfigResolver implements Resolve> { +export class RuleTableConfigResolver { private readonly config: EntityTableConfig = new EntityTableConfig(); diff --git a/ui-ngx/src/app/modules/home/pages/notification/sent/sent-table-config.resolver.ts b/ui-ngx/src/app/modules/home/pages/notification/sent/sent-table-config.resolver.ts index baee27ff73..174e30caa9 100644 --- a/ui-ngx/src/app/modules/home/pages/notification/sent/sent-table-config.resolver.ts +++ b/ui-ngx/src/app/modules/home/pages/notification/sent/sent-table-config.resolver.ts @@ -45,11 +45,11 @@ import { NotificationRequestErrorDialogData, SentErrorDialogComponent } from '@home/pages/notification/sent/sent-error-dialog.component'; -import { ActivatedRouteSnapshot, Resolve } from '@angular/router'; +import { ActivatedRouteSnapshot } from '@angular/router'; import { Injectable } from '@angular/core'; @Injectable() -export class SentTableConfigResolver implements Resolve> { +export class SentTableConfigResolver { private readonly config: EntityTableConfig = new EntityTableConfig(); diff --git a/ui-ngx/src/app/modules/home/pages/notification/template/configuration/notification-template-configuration.component.ts b/ui-ngx/src/app/modules/home/pages/notification/template/configuration/notification-template-configuration.component.ts index 06dd8d030e..76cc84d905 100644 --- a/ui-ngx/src/app/modules/home/pages/notification/template/configuration/notification-template-configuration.component.ts +++ b/ui-ngx/src/app/modules/home/pages/notification/template/configuration/notification-template-configuration.component.ts @@ -84,15 +84,16 @@ export class NotificationTemplateConfigurationComponent implements OnDestroy, Co tinyMceOptions: Record = { base_url: '/assets/tinymce', suffix: '.min', - plugins: ['link table image imagetools code fullscreen'], + plugins: ['link', 'table', 'image', 'lists', 'code', 'fullscreen'], menubar: 'edit insert tools view format table', - toolbar: 'fontselect fontsizeselect | formatselect | bold italic strikethrough forecolor backcolor ' + - '| link | table | image | alignleft aligncenter alignright alignjustify ' + - '| numlist bullist outdent indent | removeformat | code | fullscreen', + toolbar: 'undo redo | fontfamily fontsize blocks | bold italic strikethrough | forecolor backcolor ' + + '| link table image | alignleft aligncenter alignright alignjustify ' + + '| numlist bullist | outdent indent | removeformat | code | fullscreen', toolbar_mode: 'sliding', height: 400, autofocus: false, - branding: false + branding: false, + promotion: false }; private propagateChange = null; diff --git a/ui-ngx/src/app/modules/home/pages/notification/template/template-table-config.resolver.ts b/ui-ngx/src/app/modules/home/pages/notification/template/template-table-config.resolver.ts index 0f8f05649f..734688f30b 100644 --- a/ui-ngx/src/app/modules/home/pages/notification/template/template-table-config.resolver.ts +++ b/ui-ngx/src/app/modules/home/pages/notification/template/template-table-config.resolver.ts @@ -33,11 +33,11 @@ import { import { TranslateService } from '@ngx-translate/core'; import { TemplateTableHeaderComponent } from '@home/pages/notification/template/template-table-header.component'; import { Injectable } from '@angular/core'; -import { ActivatedRouteSnapshot, Resolve } from '@angular/router'; +import { ActivatedRouteSnapshot } from '@angular/router'; import { DatePipe } from '@angular/common'; @Injectable() -export class TemplateTableConfigResolver implements Resolve> { +export class TemplateTableConfigResolver { private readonly config: EntityTableConfig = new EntityTableConfig(); diff --git a/ui-ngx/src/app/modules/home/pages/ota-update/ota-update-table-config.resolve.ts b/ui-ngx/src/app/modules/home/pages/ota-update/ota-update-table-config.resolve.ts index 8e4428fec9..2993b5cad1 100644 --- a/ui-ngx/src/app/modules/home/pages/ota-update/ota-update-table-config.resolve.ts +++ b/ui-ngx/src/app/modules/home/pages/ota-update/ota-update-table-config.resolve.ts @@ -15,7 +15,7 @@ /// import { Injectable } from '@angular/core'; -import { Resolve, Router } from '@angular/router'; +import { Router } from '@angular/router'; import { CellActionDescriptorType, DateEntityTableColumn, @@ -40,7 +40,7 @@ import { Store } from '@ngrx/store'; import { AppState } from '@core/core.state'; @Injectable() -export class OtaUpdateTableConfigResolve implements Resolve> { +export class OtaUpdateTableConfigResolve { private readonly config: EntityTableConfig = new EntityTableConfig(); diff --git a/ui-ngx/src/app/modules/home/pages/profile/profile-routing.module.ts b/ui-ngx/src/app/modules/home/pages/profile/profile-routing.module.ts index 43b5ea7d09..2d594d9447 100644 --- a/ui-ngx/src/app/modules/home/pages/profile/profile-routing.module.ts +++ b/ui-ngx/src/app/modules/home/pages/profile/profile-routing.module.ts @@ -15,7 +15,7 @@ /// import { Injectable, NgModule } from '@angular/core'; -import { Resolve, RouterModule, Routes } from '@angular/router'; +import { RouterModule, Routes } from '@angular/router'; import { ProfileComponent } from './profile.component'; import { ConfirmOnExitGuard } from '@core/guards/confirm-on-exit.guard'; @@ -28,7 +28,7 @@ import { getCurrentAuthUser } from '@core/auth/auth.selectors'; import { Observable } from 'rxjs'; @Injectable() -export class UserProfileResolver implements Resolve { +export class UserProfileResolver { constructor(private store: Store, private userService: UserService) { diff --git a/ui-ngx/src/app/modules/home/pages/rulechain/rule-node-config.component.ts b/ui-ngx/src/app/modules/home/pages/rulechain/rule-node-config.component.ts index 6109bc40ab..fc73cc9d56 100644 --- a/ui-ngx/src/app/modules/home/pages/rulechain/rule-node-config.component.ts +++ b/ui-ngx/src/app/modules/home/pages/rulechain/rule-node-config.component.ts @@ -15,14 +15,12 @@ /// import { - AfterViewInit, Component, ComponentRef, EventEmitter, forwardRef, Input, OnDestroy, - OnInit, Output, ViewChild, ViewContainerRef @@ -42,7 +40,6 @@ import { import { Subscription } from 'rxjs'; import { RuleChainService } from '@core/http/rule-chain.service'; import { coerceBooleanProperty } from '@angular/cdk/coercion'; -import { TranslateService } from '@ngx-translate/core'; import { JsonObjectEditComponent } from '@shared/components/json-object-edit.component'; import { deepClone } from '@core/utils'; import { RuleChainType } from '@shared/models/rule-chain.models'; @@ -57,7 +54,7 @@ import { RuleChainType } from '@shared/models/rule-chain.models'; multi: true }] }) -export class RuleNodeConfigComponent implements ControlValueAccessor, OnInit, OnDestroy, AfterViewInit { +export class RuleNodeConfigComponent implements ControlValueAccessor, OnDestroy { @ViewChild('definedConfigContent', {read: ViewContainerRef, static: true}) definedConfigContainer: ViewContainerRef; @@ -121,10 +118,9 @@ export class RuleNodeConfigComponent implements ControlValueAccessor, OnInit, On private configuration: RuleNodeConfiguration; - private propagateChange = (v: any) => { }; + private propagateChange = (_v: any) => { }; - constructor(private translate: TranslateService, - private ruleChainService: RuleChainService, + constructor(private ruleChainService: RuleChainService, private fb: UntypedFormBuilder) { this.ruleNodeConfigFormGroup = this.fb.group({ configuration: [null, Validators.required] @@ -135,10 +131,7 @@ export class RuleNodeConfigComponent implements ControlValueAccessor, OnInit, On this.propagateChange = fn; } - registerOnTouched(fn: any): void { - } - - ngOnInit(): void { + registerOnTouched(_fn: any): void { } ngOnDestroy(): void { @@ -155,9 +148,6 @@ export class RuleNodeConfigComponent implements ControlValueAccessor, OnInit, On } } - ngAfterViewInit(): void { - } - setDisabledState(isDisabled: boolean): void { this.disabled = isDisabled; if (this.disabled) { @@ -218,8 +208,8 @@ export class RuleNodeConfigComponent implements ControlValueAccessor, OnInit, On this.changeSubscription = null; } this.definedConfigContainer.clear(); - const factory = this.ruleChainService.getRuleNodeConfigFactory(this.nodeDefinition.configDirective); - this.definedConfigComponentRef = this.definedConfigContainer.createComponent(factory); + const component = this.ruleChainService.getRuleNodeConfigComponent(this.nodeDefinition.configDirective); + this.definedConfigComponentRef = this.definedConfigContainer.createComponent(component); this.definedConfigComponent = this.definedConfigComponentRef.instance; this.definedConfigComponent.ruleNodeId = this.ruleNodeId; this.definedConfigComponent.ruleChainId = this.ruleChainId; diff --git a/ui-ngx/src/app/modules/home/pages/rulechain/rulechain-page.component.scss b/ui-ngx/src/app/modules/home/pages/rulechain/rulechain-page.component.scss index fc79a63ecf..d5bd4062bc 100644 --- a/ui-ngx/src/app/modules/home/pages/rulechain/rulechain-page.component.scss +++ b/ui-ngx/src/app/modules/home/pages/rulechain/rulechain-page.component.scss @@ -345,7 +345,7 @@ } } -.tb-rule-chain-context-menu.mat-mdc-menu-panel.mdc-menu-surface { +.tb-rule-chain-context-menu.mat-mdc-menu-panel { min-width: 320px; max-height: 404px; border-radius: 8px; diff --git a/ui-ngx/src/app/modules/home/pages/rulechain/rulechain-routing.module.ts b/ui-ngx/src/app/modules/home/pages/rulechain/rulechain-routing.module.ts index c341ae6848..0162e43655 100644 --- a/ui-ngx/src/app/modules/home/pages/rulechain/rulechain-routing.module.ts +++ b/ui-ngx/src/app/modules/home/pages/rulechain/rulechain-routing.module.ts @@ -15,16 +15,7 @@ /// import { Inject, Injectable, NgModule, Optional } from '@angular/core'; -import { - ActivatedRouteSnapshot, - CanActivate, - Resolve, - Router, - RouterModule, - RouterStateSnapshot, - Routes, - UrlTree -} from '@angular/router'; +import { ActivatedRouteSnapshot, Router, RouterModule, RouterStateSnapshot, Routes, UrlTree } from '@angular/router'; import { EntitiesTableComponent } from '../../components/entity/entities-table.component'; import { Authority } from '@shared/models/authority.enum'; @@ -44,7 +35,7 @@ import { MODULES_MAP } from '@shared/public-api'; import { IModulesMap } from '@modules/common/modules-map.models'; @Injectable() -export class RuleChainResolver implements Resolve { +export class RuleChainResolver { constructor(private ruleChainService: RuleChainService) { } @@ -56,7 +47,7 @@ export class RuleChainResolver implements Resolve { } @Injectable() -export class RuleChainMetaDataResolver implements Resolve { +export class RuleChainMetaDataResolver { constructor(private ruleChainService: RuleChainService) { } @@ -68,7 +59,7 @@ export class RuleChainMetaDataResolver implements Resolve { } @Injectable() -export class RuleNodeComponentsResolver implements Resolve> { +export class RuleNodeComponentsResolver { constructor(private ruleChainService: RuleChainService, @Optional() @Inject(MODULES_MAP) private modulesMap: IModulesMap) { @@ -80,7 +71,7 @@ export class RuleNodeComponentsResolver implements Resolve { +export class TooltipsterResolver { constructor() { } @@ -91,7 +82,7 @@ export class TooltipsterResolver implements Resolve { } @Injectable() -export class RuleChainImportGuard implements CanActivate { +export class RuleChainImportGuard { constructor(private itembuffer: ItemBufferService, private router: Router) { diff --git a/ui-ngx/src/app/modules/home/pages/rulechain/rulechains-table-config.resolver.ts b/ui-ngx/src/app/modules/home/pages/rulechain/rulechains-table-config.resolver.ts index be05b32ac5..c2065472ba 100644 --- a/ui-ngx/src/app/modules/home/pages/rulechain/rulechains-table-config.resolver.ts +++ b/ui-ngx/src/app/modules/home/pages/rulechain/rulechains-table-config.resolver.ts @@ -16,7 +16,7 @@ import { Injectable } from '@angular/core'; -import { ActivatedRouteSnapshot, Resolve, Router } from '@angular/router'; +import { ActivatedRouteSnapshot, Router } from '@angular/router'; import { CellActionDescriptor, checkBoxCell, @@ -53,7 +53,7 @@ import { PageData } from '@shared/models/page/page-data'; import { HomeDialogsService } from '@home/dialogs/home-dialogs.service'; @Injectable() -export class RuleChainsTableConfigResolver implements Resolve> { +export class RuleChainsTableConfigResolver { private readonly config: EntityTableConfig = new EntityTableConfig(); private edge: Edge; diff --git a/ui-ngx/src/app/modules/home/pages/scada-symbol/scada-symbol.component.ts b/ui-ngx/src/app/modules/home/pages/scada-symbol/scada-symbol.component.ts index 755bc99bbc..d72d95f367 100644 --- a/ui-ngx/src/app/modules/home/pages/scada-symbol/scada-symbol.component.ts +++ b/ui-ngx/src/app/modules/home/pages/scada-symbol/scada-symbol.component.ts @@ -78,7 +78,6 @@ import { SaveWidgetTypeAsDialogResult } from '@home/pages/widget/save-widget-type-as-dialog.component'; import { WidgetService } from '@core/http/widget.service'; -import { de } from 'date-fns/locale'; @Component({ selector: 'tb-scada-symbol', diff --git a/ui-ngx/src/app/modules/home/pages/security/security-routing.module.ts b/ui-ngx/src/app/modules/home/pages/security/security-routing.module.ts index 60971a4990..da0a04b2e9 100644 --- a/ui-ngx/src/app/modules/home/pages/security/security-routing.module.ts +++ b/ui-ngx/src/app/modules/home/pages/security/security-routing.module.ts @@ -15,7 +15,7 @@ /// import { Injectable, NgModule } from '@angular/core'; -import { Resolve, RouterModule, Routes } from '@angular/router'; +import { RouterModule, Routes } from '@angular/router'; import { SecurityComponent } from './security.component'; import { ConfirmOnExitGuard } from '@core/guards/confirm-on-exit.guard'; @@ -30,7 +30,7 @@ import { TwoFactorAuthProviderType } from '@shared/models/two-factor-auth.models import { TwoFactorAuthenticationService } from '@core/http/two-factor-authentication.service'; @Injectable() -export class UserProfileResolver implements Resolve { +export class UserProfileResolver { constructor(private store: Store, private userService: UserService) { @@ -43,7 +43,7 @@ export class UserProfileResolver implements Resolve { } @Injectable() -export class UserTwoFAProvidersResolver implements Resolve> { +export class UserTwoFAProvidersResolver { constructor(private twoFactorAuthService: TwoFactorAuthenticationService) { } diff --git a/ui-ngx/src/app/modules/home/pages/tenant-profile/tenant-profiles-table-config.resolver.ts b/ui-ngx/src/app/modules/home/pages/tenant-profile/tenant-profiles-table-config.resolver.ts index 48a0d8719a..bd296fbe18 100644 --- a/ui-ngx/src/app/modules/home/pages/tenant-profile/tenant-profiles-table-config.resolver.ts +++ b/ui-ngx/src/app/modules/home/pages/tenant-profile/tenant-profiles-table-config.resolver.ts @@ -15,7 +15,7 @@ /// import { Injectable } from '@angular/core'; -import { Resolve, Router } from '@angular/router'; +import { Router } from '@angular/router'; import { TenantProfile } from '@shared/models/tenant.model'; import { checkBoxCell, @@ -35,7 +35,7 @@ import { DialogService } from '@core/services/dialog.service'; import { ImportExportService } from '@shared/import-export/import-export.service'; @Injectable() -export class TenantProfilesTableConfigResolver implements Resolve> { +export class TenantProfilesTableConfigResolver { private readonly config: EntityTableConfig = new EntityTableConfig(); diff --git a/ui-ngx/src/app/modules/home/pages/tenant/tenants-table-config.resolver.ts b/ui-ngx/src/app/modules/home/pages/tenant/tenants-table-config.resolver.ts index 15fd900d5e..1fe5bf7dbd 100644 --- a/ui-ngx/src/app/modules/home/pages/tenant/tenants-table-config.resolver.ts +++ b/ui-ngx/src/app/modules/home/pages/tenant/tenants-table-config.resolver.ts @@ -16,7 +16,7 @@ import { Injectable } from '@angular/core'; -import { Resolve, Router } from '@angular/router'; +import { Router } from '@angular/router'; import { TenantInfo } from '@shared/models/tenant.model'; import { @@ -34,7 +34,7 @@ import { TenantTabsComponent } from '@home/pages/tenant/tenant-tabs.component'; import { mergeMap } from 'rxjs/operators'; @Injectable() -export class TenantsTableConfigResolver implements Resolve> { +export class TenantsTableConfigResolver { private readonly config: EntityTableConfig = new EntityTableConfig(); diff --git a/ui-ngx/src/app/modules/home/pages/user/users-table-config.resolver.ts b/ui-ngx/src/app/modules/home/pages/user/users-table-config.resolver.ts index a8f7df963f..24d5eea8f7 100644 --- a/ui-ngx/src/app/modules/home/pages/user/users-table-config.resolver.ts +++ b/ui-ngx/src/app/modules/home/pages/user/users-table-config.resolver.ts @@ -16,7 +16,7 @@ import { Injectable } from '@angular/core'; -import { ActivatedRouteSnapshot, Resolve, Router } from '@angular/router'; +import { ActivatedRouteSnapshot, Router } from '@angular/router'; import { DateEntityTableColumn, EntityTableColumn, @@ -57,7 +57,7 @@ export interface UsersTableRouteData { } @Injectable() -export class UsersTableConfigResolver implements Resolve> { +export class UsersTableConfigResolver { private readonly config: EntityTableConfig = new EntityTableConfig(); diff --git a/ui-ngx/src/app/modules/home/pages/widget/widget-types-table-config.resolver.ts b/ui-ngx/src/app/modules/home/pages/widget/widget-types-table-config.resolver.ts index 0ec7635c9d..eac0817875 100644 --- a/ui-ngx/src/app/modules/home/pages/widget/widget-types-table-config.resolver.ts +++ b/ui-ngx/src/app/modules/home/pages/widget/widget-types-table-config.resolver.ts @@ -16,7 +16,7 @@ import { Injectable } from '@angular/core'; -import { Resolve, Router } from '@angular/router'; +import { Router } from '@angular/router'; import { checkBoxCell, DateEntityTableColumn, @@ -48,7 +48,7 @@ import { SelectWidgetTypeDialogComponent } from '@home/pages/widget/select-widge import { MatDialog } from '@angular/material/dialog'; @Injectable() -export class WidgetTypesTableConfigResolver implements Resolve> { +export class WidgetTypesTableConfigResolver { private readonly config: EntityTableConfig = new EntityTableConfig(); diff --git a/ui-ngx/src/app/modules/home/pages/widget/widgets-bundles-table-config.resolver.ts b/ui-ngx/src/app/modules/home/pages/widget/widgets-bundles-table-config.resolver.ts index 32e1c6fb1a..294c0b9629 100644 --- a/ui-ngx/src/app/modules/home/pages/widget/widgets-bundles-table-config.resolver.ts +++ b/ui-ngx/src/app/modules/home/pages/widget/widgets-bundles-table-config.resolver.ts @@ -16,7 +16,7 @@ import { Injectable } from '@angular/core'; -import { Resolve, Router } from '@angular/router'; +import { Router } from '@angular/router'; import { checkBoxCell, DateEntityTableColumn, @@ -41,7 +41,7 @@ import { Direction } from '@shared/models/page/sort-order'; import { WidgetsBundleTabsComponent } from '@home/pages/widget/widgets-bundle-tabs.component'; @Injectable() -export class WidgetsBundlesTableConfigResolver implements Resolve> { +export class WidgetsBundlesTableConfigResolver { private readonly config: EntityTableConfig = new EntityTableConfig(); diff --git a/ui-ngx/src/app/shared/components/cheatsheet.component.ts b/ui-ngx/src/app/shared/components/cheatsheet.component.ts index 958f4186a3..d3cf2a5cee 100644 --- a/ui-ngx/src/app/shared/components/cheatsheet.component.ts +++ b/ui-ngx/src/app/shared/components/cheatsheet.component.ts @@ -17,7 +17,7 @@ import { Component, ElementRef, Input, OnDestroy, OnInit } from '@angular/core'; import { Hotkey, HotkeysService } from 'angular2-hotkeys'; import { MousetrapInstance } from 'mousetrap'; -import * as Mousetrap from 'mousetrap'; +import Mousetrap from 'mousetrap'; @Component({ selector : 'tb-hotkeys-cheatsheet', diff --git a/ui-ngx/src/app/shared/components/color-picker/color-picker.component.html b/ui-ngx/src/app/shared/components/color-picker/color-picker.component.html index 888c5b0b0b..b7fd99efd1 100644 --- a/ui-ngx/src/app/shared/components/color-picker/color-picker.component.html +++ b/ui-ngx/src/app/shared/components/color-picker/color-picker.component.html @@ -16,7 +16,7 @@ -->
- +
@@ -25,7 +25,7 @@ [color]="control.value">
- +
@@ -38,9 +38,9 @@
+ [(color)]="control.value"> + [(color)]="control.value">
@@ -48,5 +48,5 @@
- +
diff --git a/ui-ngx/src/app/shared/components/dialog.component.ts b/ui-ngx/src/app/shared/components/dialog.component.ts index e0cd2e2ad4..283194bc0b 100644 --- a/ui-ngx/src/app/shared/components/dialog.component.ts +++ b/ui-ngx/src/app/shared/components/dialog.component.ts @@ -19,7 +19,7 @@ import { PageComponent } from '@shared/components/page.component'; import { Store } from '@ngrx/store'; import { AppState } from '@core/core.state'; import { MatDialogRef } from '@angular/material/dialog'; -import { NavigationStart, Router, RouterEvent } from '@angular/router'; +import { NavigationStart, Router, Event } from '@angular/router'; import { Subscription } from 'rxjs'; import { filter } from 'rxjs/operators'; @@ -34,7 +34,7 @@ export abstract class DialogComponent extends PageComponent implemen super(store); this.routerSubscription = this.router.events .pipe( - filter((event: RouterEvent) => event instanceof NavigationStart), + filter((event: Event) => event instanceof NavigationStart), filter(() => !!this.dialogRef) ) .subscribe(() => { diff --git a/ui-ngx/src/app/shared/components/directives/component-outlet.directive.ts b/ui-ngx/src/app/shared/components/directives/component-outlet.directive.ts index 71100527a5..008e5fbc37 100644 --- a/ui-ngx/src/app/shared/components/directives/component-outlet.directive.ts +++ b/ui-ngx/src/app/shared/components/directives/component-outlet.directive.ts @@ -15,13 +15,13 @@ /// import { - ComponentFactory, ComponentRef, + ComponentRef, Directive, EventEmitter, Injector, Input, OnChanges, Output, Renderer2, SimpleChange, SimpleChanges, - TemplateRef, + Type, ViewContainerRef } from '@angular/core'; @@ -36,13 +36,11 @@ export class TbComponentOutletDirective<_T = unknown> implements OnChanges { @Input() tbComponentOutletContext: any | null = null; @Input() tbComponentStyle: { [klass: string]: any } | null = null; @Input() tbComponentInjector: Injector | null = null; - @Input() tbComponentOutlet: ComponentFactory = null; + @Input() tbComponentOutlet: Type = null; @Output() componentChange = new EventEmitter>(); static ngTemplateContextGuard( - // eslint-disable-next-line @typescript-eslint/naming-convention,no-underscore-dangle,id-blacklist,id-match _dir: TbComponentOutletDirective, - // eslint-disable-next-line @typescript-eslint/naming-convention, no-underscore-dangle, id-blacklist, id-match _ctx: any ): _ctx is TbComponentOutletContext { return true; @@ -50,7 +48,7 @@ export class TbComponentOutletDirective<_T = unknown> implements OnChanges { private recreateComponent(): void { this.viewContainer.clear(); - this.componentRef = this.viewContainer.createComponent(this.tbComponentOutlet, 0, this.tbComponentInjector); + this.componentRef = this.viewContainer.createComponent(this.tbComponentOutlet, {index: 0, injector: this.tbComponentInjector}); this.componentChange.next(this.componentRef); if (this.tbComponentOutletContext) { for (const propName of Object.keys(this.tbComponentOutletContext)) { @@ -85,8 +83,8 @@ export class TbComponentOutletDirective<_T = unknown> implements OnChanges { if (tbComponentOutlet.firstChange) { shouldOutletRecreate = true; } else { - const isPreviousOutletTemplate = tbComponentOutlet.previousValue instanceof ComponentFactory; - const isCurrentOutletTemplate = tbComponentOutlet.currentValue instanceof ComponentFactory; + const isPreviousOutletTemplate = tbComponentOutlet.previousValue instanceof Type; + const isCurrentOutletTemplate = tbComponentOutlet.currentValue instanceof Type; shouldOutletRecreate = isPreviousOutletTemplate || isCurrentOutletTemplate; } } diff --git a/ui-ngx/src/app/shared/components/entity/entity-list.component.ts b/ui-ngx/src/app/shared/components/entity/entity-list.component.ts index cfb0f19b1b..44a8a5be82 100644 --- a/ui-ngx/src/app/shared/components/entity/entity-list.component.ts +++ b/ui-ngx/src/app/shared/components/entity/entity-list.component.ts @@ -158,7 +158,7 @@ export class EntityListComponent implements ControlValueAccessor, OnInit, AfterV } }), filter((value) => typeof value === 'string'), - map((value) => value ? (typeof value === 'string' ? value : value.name) : ''), + map((value) => value ? value : ''), mergeMap(name => this.fetchEntities(name) ), share() ); diff --git a/ui-ngx/src/app/shared/components/entity/entity-type-list.component.ts b/ui-ngx/src/app/shared/components/entity/entity-type-list.component.ts index 76cfb69e5e..fd27e00ac4 100644 --- a/ui-ngx/src/app/shared/components/entity/entity-type-list.component.ts +++ b/ui-ngx/src/app/shared/components/entity/entity-type-list.component.ts @@ -177,7 +177,7 @@ export class EntityTypeListComponent implements ControlValueAccessor, OnInit, Af } }), filter((value) => typeof value === 'string'), - map((value) => value ? (typeof value === 'string' ? value : value.name) : ''), + map((value) => value ? value : ''), mergeMap(name => this.fetchEntityTypes(name) ), share() ); diff --git a/ui-ngx/src/app/shared/components/js-func.component.html b/ui-ngx/src/app/shared/components/js-func.component.html index 082a92b2c1..f38749550a 100644 --- a/ui-ngx/src/app/shared/components/js-func.component.html +++ b/ui-ngx/src/app/shared/components/js-func.component.html @@ -45,6 +45,6 @@
- +
diff --git a/ui-ngx/src/app/shared/components/json-form/json-form.component.ts b/ui-ngx/src/app/shared/components/json-form/json-form.component.ts index 8311616b26..691b1eca1b 100644 --- a/ui-ngx/src/app/shared/components/json-form/json-form.component.ts +++ b/ui-ngx/src/app/shared/components/json-form/json-form.component.ts @@ -18,11 +18,11 @@ import { ChangeDetectorRef, Component, ElementRef, - forwardRef, Injector, + forwardRef, Input, OnChanges, OnDestroy, - OnInit, Renderer2, + Renderer2, SimpleChanges, ViewChild, ViewContainerRef, ViewEncapsulation @@ -32,20 +32,15 @@ import { coerceBooleanProperty } from '@angular/cdk/coercion'; import { Store } from '@ngrx/store'; import { AppState } from '@core/core.state'; import { deepClone, isString } from '@app/core/utils'; -import { TranslateService } from '@ngx-translate/core'; import { JsonFormProps } from './react/json-form.models'; import inspector from 'schema-inspector'; import tinycolor from 'tinycolor2'; import { DialogService } from '@app/core/services/dialog.service'; -// import * as React from 'react'; -// import * as ReactDOM from 'react-dom'; -// import ReactSchemaForm from './react/json-form-react'; import JsonFormUtils from './react/json-form-utils'; import { JsonFormComponentData } from './json-form-component.models'; import { GroupInfo } from '@shared/models/widget.models'; import { Observable } from 'rxjs/internal/Observable'; import { forkJoin, from } from 'rxjs'; -import { MouseEvent } from 'react'; import { TbPopoverService } from '@shared/components/popover.service'; @Component({ @@ -66,7 +61,7 @@ import { TbPopoverService } from '@shared/components/popover.service'; ], encapsulation: ViewEncapsulation.None }) -export class JsonFormComponent implements OnInit, ControlValueAccessor, Validator, OnChanges, OnDestroy { +export class JsonFormComponent implements ControlValueAccessor, Validator, OnChanges, OnDestroy { @ViewChild('reactRoot', {static: true}) reactRootElmRef: ElementRef; @@ -109,13 +104,14 @@ export class JsonFormComponent implements OnInit, ControlValueAccessor, Validato isFullscreen = false; fullscreenFinishFn: (el: Element) => void; + private reactRoot: any; + private propagateChange = null; private propagateChangePending = false; private writingValue = false; private updateViewPending = false; constructor(public elementRef: ElementRef, - private translate: TranslateService, private dialogs: DialogService, private popoverService: TbPopoverService, private renderer: Renderer2, @@ -124,9 +120,6 @@ export class JsonFormComponent implements OnInit, ControlValueAccessor, Validato private cd: ChangeDetectorRef) { } - ngOnInit(): void { - } - ngOnDestroy(): void { this.destroyReactSchemaForm(); } @@ -269,33 +262,25 @@ export class JsonFormComponent implements OnInit, ControlValueAccessor, Validato } // import ReactSchemaForm from './react/json-form-react'; - const reactSchemaFormObservables: Observable[] = []; - reactSchemaFormObservables.push(from(import('react'))); - reactSchemaFormObservables.push(from(import('react-dom'))); - reactSchemaFormObservables.push(from(import('./react/json-form-react'))); + const reactSchemaFormObservables: Observable[] = [ + from(import('react')), + from(import('react-dom')), + from(import('react-dom/client')), + from(import('./react/json-form-react')) + ]; forkJoin(reactSchemaFormObservables).subscribe( (modules) => { - const react = modules[0]; - const reactDom = modules[1]; - const jsonFormReact = modules[2].default; - reactDom.render(react.createElement(jsonFormReact, this.formProps), this.reactRootElmRef.nativeElement); + const react = modules[0]; + const reactDomClient = modules[2]; + const jsonFormReact = modules[3].default; + this.reactRoot = reactDomClient.createRoot(this.reactRootElmRef.nativeElement); + this.reactRoot.render(react.createElement(jsonFormReact, this.formProps)); } ); - /* import('./react/json-form-react').then( - (mod) => { - ReactDOM.render(React.createElement(mod.default, this.formProps), this.reactRootElmRef.nativeElement); - } - );*/ - // ReactDOM.render(React.createElement(ReactSchemaForm, this.formProps), this.reactRootElmRef.nativeElement); } private destroyReactSchemaForm() { - import('react-dom').then( - (reactDom) => { - reactDom.unmountComponentAtNode(this.reactRootElmRef.nativeElement); - } - ); - // ReactDOM.unmountComponentAtNode(this.reactRootElmRef.nativeElement); + this.reactRoot?.unmount(); } private validateModel(): boolean { diff --git a/ui-ngx/src/app/shared/components/json-form/react/json-form-ace-editor.tsx b/ui-ngx/src/app/shared/components/json-form/react/json-form-ace-editor.tsx index 8d5a0d1038..d9fd64f951 100644 --- a/ui-ngx/src/app/shared/components/json-form/react/json-form-ace-editor.tsx +++ b/ui-ngx/src/app/shared/components/json-form/react/json-form-ace-editor.tsx @@ -17,23 +17,23 @@ import * as React from 'react'; import * as ReactDOM from 'react-dom'; import ThingsboardBaseComponent from './json-form-base-component'; import reactCSS from 'reactcss'; -import Button from '@material-ui/core/Button'; +import Button from '@mui/material/Button'; import { JsonFormFieldProps, JsonFormFieldState } from '@shared/components/json-form/react/json-form.models'; import { IEditorProps } from 'react-ace/src/types'; import { mergeMap } from 'rxjs/operators'; import { getAce } from '@shared/models/ace/ace.models'; -import { from } from 'rxjs'; +import { from, lastValueFrom } from 'rxjs'; import { Observable } from 'rxjs/internal/Observable'; -import { CircularProgress, IconButton } from '@material-ui/core'; +import { CircularProgress, IconButton } from '@mui/material'; import { MouseEvent } from 'react'; -import { Help, HelpOutline } from '@material-ui/icons'; +import { Help, HelpOutline } from '@mui/icons-material'; const ReactAce = React.lazy(() => { - return getAce().pipe( + return lastValueFrom(getAce().pipe( mergeMap(() => { return from(import('react-ace')); }) - ).toPromise(); + )); }); interface ThingsboardAceEditorProps extends JsonFormFieldProps { @@ -53,7 +53,7 @@ class ThingsboardAceEditor extends React.Component { - constructor(props) { + constructor(props: JsonFormFieldProps) { super(props); this.onAppend = this.onAppend.bind(this); this.onDelete = this.onDelete.bind(this); @@ -130,12 +130,10 @@ class ThingsboardArray extends React.Component; diff --git a/ui-ngx/src/app/shared/components/json-form/react/json-form-base-component.tsx b/ui-ngx/src/app/shared/components/json-form/react/json-form-base-component.tsx index 1288861217..4e9687ce3a 100644 --- a/ui-ngx/src/app/shared/components/json-form/react/json-form-base-component.tsx +++ b/ui-ngx/src/app/shared/components/json-form/react/json-form-base-component.tsx @@ -21,7 +21,7 @@ import { isDefinedAndNotNull } from '@core/utils'; export default ThingsboardBaseComponent => class

extends React.Component { - constructor(props) { + constructor(props: P) { super(props); this.onChangeValidate = this.onChangeValidate.bind(this); const value = this.defaultValue(); @@ -42,8 +42,10 @@ export default ThingsboardBaseComponent => class

onChangeValidate(e, forceUpdate?: boolean) { let value = null; if (this.props.form.schema.type === 'integer' || this.props.form.schema.type === 'number') { - if (e.target.value === null || e.target.value === '') { + if (!e || e.target?.value === null || e.target?.value === '') { value = undefined; + } else if (typeof e === 'number') { + value = Number(e); } else if (e.target.value.indexOf('.') === -1) { value = parseInt(e.target.value, 10); } else { diff --git a/ui-ngx/src/app/shared/components/json-form/react/json-form-checkbox.tsx b/ui-ngx/src/app/shared/components/json-form/react/json-form-checkbox.tsx index a74a7b8f9c..fd3bac8f2c 100644 --- a/ui-ngx/src/app/shared/components/json-form/react/json-form-checkbox.tsx +++ b/ui-ngx/src/app/shared/components/json-form/react/json-form-checkbox.tsx @@ -15,9 +15,9 @@ */ import * as React from 'react'; import ThingsboardBaseComponent from './json-form-base-component'; -import Checkbox from '@material-ui/core/Checkbox'; +import Checkbox from '@mui/material/Checkbox'; import { JsonFormFieldProps, JsonFormFieldState } from './json-form.models.js'; -import FormControlLabel from '@material-ui/core/FormControlLabel'; +import FormControlLabel from '@mui/material/FormControlLabel'; class ThingsboardCheckbox extends React.Component { render() { @@ -26,11 +26,12 @@ class ThingsboardCheckbox extends React.Component { + onChange={(e) => { this.props.onChangeValidate(e); }} /> diff --git a/ui-ngx/src/app/shared/components/json-form/react/json-form-color.tsx b/ui-ngx/src/app/shared/components/json-form/react/json-form-color.tsx index 6800d7593a..bf3a245663 100644 --- a/ui-ngx/src/app/shared/components/json-form/react/json-form-color.tsx +++ b/ui-ngx/src/app/shared/components/json-form/react/json-form-color.tsx @@ -14,15 +14,14 @@ * limitations under the License. */ import * as React from 'react'; -import * as ReactDOM from 'react-dom'; import ThingsboardBaseComponent from './json-form-base-component'; import reactCSS from 'reactcss'; import tinycolor from 'tinycolor2'; -import TextField from '@material-ui/core/TextField'; +import TextField from '@mui/material/TextField'; import { JsonFormFieldProps, JsonFormFieldState } from '@shared/components/json-form/react/json-form.models'; -import IconButton from '@material-ui/core/IconButton'; -import Clear from '@material-ui/icons/Clear'; -import Tooltip from '@material-ui/core/Tooltip'; +import IconButton from '@mui/material/IconButton'; +import Clear from '@mui/icons-material/Clear'; +import Tooltip from '@mui/material/Tooltip'; interface ThingsboardColorState extends JsonFormFieldState { color: tinycolor.ColorFormats.RGBA | null; @@ -31,7 +30,9 @@ interface ThingsboardColorState extends JsonFormFieldState { class ThingsboardColor extends React.Component { - constructor(props) { + containerRef = React.createRef(); + + constructor(props: JsonFormFieldProps) { super(props); this.onBlur = this.onBlur.bind(this); this.onFocus = this.onFocus.bind(this); @@ -55,17 +56,17 @@ class ThingsboardColor extends React.Component { + colContainer.click(() => { if (!this.props.form.readonly) { - this.onSwatchClick(event); + this.onSwatchClick(); } }); } componentWillUnmount() { - const node = ReactDOM.findDOMNode(this); + const node = this.containerRef.current; const colContainer = $(node).children('#color-container'); colContainer.off( 'click' ); } @@ -91,7 +92,7 @@ class ThingsboardColor extends React.Component { this.onValueChanged(color); @@ -99,7 +100,7 @@ class ThingsboardColor extends React.Component +

{ - constructor(props) { + constructor(props: JsonFormFieldProps) { super(props); this.onTidyCss = this.onTidyCss.bind(this); } diff --git a/ui-ngx/src/app/shared/components/json-form/react/json-form-date.tsx b/ui-ngx/src/app/shared/components/json-form/react/json-form-date.tsx index 9a0671aa20..3b253cfa8e 100644 --- a/ui-ngx/src/app/shared/components/json-form/react/json-form-date.tsx +++ b/ui-ngx/src/app/shared/components/json-form/react/json-form-date.tsx @@ -15,9 +15,10 @@ */ import * as React from 'react'; import ThingsboardBaseComponent from './json-form-base-component'; -import DateFnsUtils from '@date-io/date-fns'; -import { KeyboardDatePicker, MuiPickersUtilsProvider } from '@material-ui/pickers'; +import { AdapterMoment } from '@mui/x-date-pickers/AdapterMoment' +import { LocalizationProvider, DatePicker } from '@mui/x-date-pickers'; import { JsonFormFieldProps, JsonFormFieldState } from '@shared/components/json-form/react/json-form.models'; +import moment from 'moment'; interface ThingsboardDateState extends JsonFormFieldState { currentValue: Date | null; @@ -25,7 +26,7 @@ interface ThingsboardDateState extends JsonFormFieldState { class ThingsboardDate extends React.Component { - constructor(props) { + constructor(props: JsonFormFieldProps) { super(props); this.onDatePicked = this.onDatePicked.bind(this); let value: Date | null = null; @@ -38,11 +39,11 @@ class ThingsboardDate extends React.Component +
- + sx={this.props.form.style || {width: '100%'}} + />
- + ); } } diff --git a/ui-ngx/src/app/shared/components/json-form/react/json-form-html.tsx b/ui-ngx/src/app/shared/components/json-form/react/json-form-html.tsx index 07f9d119cf..f267154182 100644 --- a/ui-ngx/src/app/shared/components/json-form/react/json-form-html.tsx +++ b/ui-ngx/src/app/shared/components/json-form/react/json-form-html.tsx @@ -21,7 +21,7 @@ import { beautifyHtml } from '@shared/models/beautify.models'; class ThingsboardHtml extends React.Component { - constructor(props) { + constructor(props: JsonFormFieldProps) { super(props); this.onTidyHtml = this.onTidyHtml.bind(this); } diff --git a/ui-ngx/src/app/shared/components/json-form/react/json-form-icon.tsx b/ui-ngx/src/app/shared/components/json-form/react/json-form-icon.tsx index f898aa8714..00366b86e8 100644 --- a/ui-ngx/src/app/shared/components/json-form/react/json-form-icon.tsx +++ b/ui-ngx/src/app/shared/components/json-form/react/json-form-icon.tsx @@ -14,15 +14,15 @@ * limitations under the License. */ import * as React from 'react'; -import * as ReactDOM from 'react-dom'; +import { MouseEvent } from 'react'; import ThingsboardBaseComponent from './json-form-base-component'; import reactCSS from 'reactcss'; -import TextField from '@material-ui/core/TextField'; -import IconButton from '@material-ui/core/IconButton'; +import TextField from '@mui/material/TextField'; +import IconButton from '@mui/material/IconButton'; import { JsonFormFieldProps, JsonFormFieldState } from '@shared/components/json-form/react/json-form.models'; -import Clear from '@material-ui/icons/Clear'; -import Icon from '@material-ui/core/Icon'; -import Tooltip from '@material-ui/core/Tooltip'; +import Clear from '@mui/icons-material/Clear'; +import Icon from '@mui/material/Icon'; +import Tooltip from '@mui/material/Tooltip'; interface ThingsboardIconState extends JsonFormFieldState { icon: string | null; @@ -31,7 +31,9 @@ interface ThingsboardIconState extends JsonFormFieldState { class ThingsboardIcon extends React.Component { - constructor(props) { + containerRef = React.createRef(); + + constructor(props: JsonFormFieldProps) { super(props); this.onBlur = this.onBlur.bind(this); this.onFocus = this.onFocus.bind(this); @@ -54,9 +56,9 @@ class ThingsboardIcon extends React.Component { + iconContainer.on('click', (event) => { if (!this.props.form.readonly) { this.onIconClick(event); } @@ -64,20 +66,19 @@ class ThingsboardIcon extends React.Component { this.onValueChanged(color); @@ -85,7 +86,7 @@ class ThingsboardIcon extends React.Component +
{pickedIcon} { - constructor(props) { + constructor(props: JsonFormFieldProps) { super(props); this.onDrop = this.onDrop.bind(this); this.onClear = this.onClear.bind(this); @@ -40,12 +40,12 @@ class ThingsboardImage extends React.Component { - this.onValueChanged(reader.result); + this.onValueChanged(reader.result as string); }; reader.readAsDataURL(acceptedFiles[0]); } - onValueChanged(value) { + onValueChanged(value: string) { this.setState({ imageUrl: value }); @@ -56,7 +56,7 @@ class ThingsboardImage extends React.Component; } else { @@ -91,7 +91,7 @@ class ThingsboardImage extends React.Component
+ accept={ {'image/*': []} } multiple={false}> {({getRootProps, getInputProps}) => (
Drop an image or click to select a file to upload.
diff --git a/ui-ngx/src/app/shared/components/json-form/react/json-form-javascript.tsx b/ui-ngx/src/app/shared/components/json-form/react/json-form-javascript.tsx index 9567062584..74d01137a8 100644 --- a/ui-ngx/src/app/shared/components/json-form/react/json-form-javascript.tsx +++ b/ui-ngx/src/app/shared/components/json-form/react/json-form-javascript.tsx @@ -21,7 +21,7 @@ import { beautifyJs } from '@shared/models/beautify.models'; class ThingsboardJavaScript extends React.Component { - constructor(props) { + constructor(props: JsonFormFieldProps) { super(props); this.onTidyJavascript = this.onTidyJavascript.bind(this); } diff --git a/ui-ngx/src/app/shared/components/json-form/react/json-form-json.tsx b/ui-ngx/src/app/shared/components/json-form/react/json-form-json.tsx index a17074eff6..9ab839616b 100644 --- a/ui-ngx/src/app/shared/components/json-form/react/json-form-json.tsx +++ b/ui-ngx/src/app/shared/components/json-form/react/json-form-json.tsx @@ -21,7 +21,7 @@ import { beautifyJs } from '@shared/models/beautify.models'; class ThingsboardJson extends React.Component { - constructor(props) { + constructor(props: JsonFormFieldProps) { super(props); this.onTidyJson = this.onTidyJson.bind(this); } diff --git a/ui-ngx/src/app/shared/components/json-form/react/json-form-markdown.tsx b/ui-ngx/src/app/shared/components/json-form/react/json-form-markdown.tsx index 838bf39151..57fb97ae23 100644 --- a/ui-ngx/src/app/shared/components/json-form/react/json-form-markdown.tsx +++ b/ui-ngx/src/app/shared/components/json-form/react/json-form-markdown.tsx @@ -19,7 +19,7 @@ import { JsonFormFieldProps, JsonFormFieldState } from '@shared/components/json- class ThingsboardMarkdown extends React.Component { - constructor(props) { + constructor(props: JsonFormFieldProps) { super(props); } diff --git a/ui-ngx/src/app/shared/components/json-form/react/json-form-number.tsx b/ui-ngx/src/app/shared/components/json-form/react/json-form-number.tsx index e440f4b824..4616324de2 100644 --- a/ui-ngx/src/app/shared/components/json-form/react/json-form-number.tsx +++ b/ui-ngx/src/app/shared/components/json-form/react/json-form-number.tsx @@ -16,7 +16,8 @@ import * as React from 'react'; import ThingsboardBaseComponent from './json-form-base-component'; import { JsonFormFieldProps, JsonFormFieldState } from '@shared/components/json-form/react/json-form.models'; -import { TextField } from '@material-ui/core'; +import { TextField } from '@mui/material'; +import { ChangeEvent } from 'react'; interface ThingsboardNumberState extends JsonFormFieldState { focused: boolean; @@ -25,7 +26,7 @@ interface ThingsboardNumberState extends JsonFormFieldState { class ThingsboardNumber extends React.Component { - constructor(props) { + constructor(props: JsonFormFieldProps) { super(props); this.preValidationCheck = this.preValidationCheck.bind(this); this.onBlur = this.onBlur.bind(this); @@ -36,7 +37,7 @@ class ThingsboardNumber extends React.Component) { if (this.isNumeric(e.target.value)) { this.setState({ - lastSuccessfulValue: e.target.value + lastSuccessfulValue: Number(e.target.value) }); this.props.onChangeValidate(e); } @@ -78,6 +79,7 @@ class ThingsboardNumber extends React.Component { render() { const items = this.props.form.titleMap.map((item, index) => { return ( - } label={item.name} key={index} /> + } label={item.name} key={index} /> ); }); diff --git a/ui-ngx/src/app/shared/components/json-form/react/json-form-rc-select.tsx b/ui-ngx/src/app/shared/components/json-form/react/json-form-rc-select.tsx index 4af321087d..ee21674b94 100644 --- a/ui-ngx/src/app/shared/components/json-form/react/json-form-rc-select.tsx +++ b/ui-ngx/src/app/shared/components/json-form/react/json-form-rc-select.tsx @@ -32,7 +32,7 @@ interface ThingsboardRcSelectState extends JsonFormFieldState { class ThingsboardRcSelect extends React.Component { - constructor(props) { + constructor(props: JsonFormFieldProps) { super(props); this.onSelect = this.onSelect.bind(this); this.onDeselect = this.onDeselect.bind(this); @@ -96,7 +96,7 @@ class ThingsboardRcSelect extends React.Component 0) { - options = this.state.items.map((item, idx) => ( - + options = this.state.items.map((item) => ( + )); } diff --git a/ui-ngx/src/app/shared/components/json-form/react/json-form-react.tsx b/ui-ngx/src/app/shared/components/json-form/react/json-form-react.tsx index 57fb235212..a56054a614 100644 --- a/ui-ngx/src/app/shared/components/json-form/react/json-form-react.tsx +++ b/ui-ngx/src/app/shared/components/json-form/react/json-form-react.tsx @@ -14,7 +14,7 @@ * limitations under the License. */ import * as React from 'react'; -import { createTheme, ThemeProvider } from '@material-ui/core/styles'; +import { createTheme, ThemeProvider } from '@mui/material/styles'; import thingsboardTheme from './styles/thingsboardTheme'; import ThingsboardSchemaForm from './json-form-schema-form'; import { JsonFormProps } from './json-form.models'; diff --git a/ui-ngx/src/app/shared/components/json-form/react/json-form-schema-form.tsx b/ui-ngx/src/app/shared/components/json-form/react/json-form-schema-form.tsx index 1e641493b0..7c37d720dd 100644 --- a/ui-ngx/src/app/shared/components/json-form/react/json-form-schema-form.tsx +++ b/ui-ngx/src/app/shared/components/json-form/react/json-form-schema-form.tsx @@ -46,14 +46,14 @@ import _ from 'lodash'; import tinycolor from 'tinycolor2'; import { GroupInfo } from '@shared/models/widget.models'; import ThingsboardMarkdown from '@shared/components/json-form/react/json-form-markdown'; -import { MouseEvent } from 'react'; +import { MouseEvent, ReactNode } from 'react'; class ThingsboardSchemaForm extends React.Component { private hasConditions: boolean; private readonly mapper: {[type: string]: any}; - constructor(props) { + constructor(props: JsonFormProps) { super(props); this.mapper = { @@ -121,7 +121,7 @@ class ThingsboardSchemaForm extends React.Component { onIconClick: OnIconClickFn, onToggleFullscreen: onToggleFullscreenFn, onHelpClick: onHelpClickFn, - mapper: {[type: string]: any}): JSX.Element { + mapper: {[type: string]: any}): React.JSX.Element { const type = form.type; const Field = this.mapper[type]; if (!Field) { @@ -143,13 +143,13 @@ class ThingsboardSchemaForm extends React.Component { mapper={mapper} builder={this.builder}/>; } - createSchema(theForm: any[]): JSX.Element { + createSchema(theForm: any[]): React.JSX.Element { const merged = JsonFormUtils.merge(this.props.schema, theForm, this.props.ignore, this.props.option); let mapper = this.mapper; if (this.props.mapper) { mapper = _.merge(this.mapper, this.props.mapper); } - const forms = merged.map(function(form, index) { + const forms: ReactNode[] = merged.map(function(form: JsonFormData, index: number) { return this.builder(form, this.props.model, index, this.onChange, this.onColorClick, this.onIconClick, this.onToggleFullscreen, this.onHelpClick, mapper); }.bind(this)); @@ -166,7 +166,7 @@ class ThingsboardSchemaForm extends React.Component { render() { if (this.props.groupInfoes && this.props.groupInfoes.length > 0) { - const content: JSX.Element[] = []; + const content: React.JSX.Element[] = []; for (const info of this.props.groupInfoes) { const forms = this.createSchema(this.props.form[info.formIndex]); const item = ; @@ -182,7 +182,7 @@ export default ThingsboardSchemaForm; interface ThingsboardSchemaGroupProps { info: GroupInfo; - forms: JSX.Element; + forms: React.JSX.Element; } interface ThingsboardSchemaGroupState { @@ -190,14 +190,14 @@ interface ThingsboardSchemaGroupState { } class ThingsboardSchemaGroup extends React.Component { - constructor(props) { + constructor(props: ThingsboardSchemaGroupProps) { super(props); this.state = { showGroup: true }; } - toogleGroup(index) { + toogleGroup() { this.setState({ showGroup: !this.state.showGroup }); diff --git a/ui-ngx/src/app/shared/components/json-form/react/json-form-select.tsx b/ui-ngx/src/app/shared/components/json-form/react/json-form-select.tsx index ea59b73791..46da881e38 100644 --- a/ui-ngx/src/app/shared/components/json-form/react/json-form-select.tsx +++ b/ui-ngx/src/app/shared/components/json-form/react/json-form-select.tsx @@ -15,11 +15,12 @@ */ import * as React from 'react'; import { JsonFormFieldProps, JsonFormFieldState } from '@shared/components/json-form/react/json-form.models'; -import MenuItem from '@material-ui/core/MenuItem'; -import FormControl from '@material-ui/core/FormControl'; -import InputLabel from '@material-ui/core/InputLabel'; -import Select from '@material-ui/core/Select'; +import MenuItem from '@mui/material/MenuItem'; +import FormControl from '@mui/material/FormControl'; +import InputLabel from '@mui/material/InputLabel'; +import Select, { SelectChangeEvent } from '@mui/material/Select'; import ThingsboardBaseComponent from '@shared/components/json-form/react/json-form-base-component'; +import { isObject } from '@core/utils'; interface ThingsboardSelectState extends JsonFormFieldState { currentValue: any; @@ -27,34 +28,39 @@ interface ThingsboardSelectState extends JsonFormFieldState { class ThingsboardSelect extends React.Component { - constructor(props) { - super(props); - this.onSelected = this.onSelected.bind(this); - const possibleValue = this.getModelKey(this.props.model, this.props.form.key); - this.state = { - currentValue: this.props.model !== undefined && possibleValue ? possibleValue : this.props.form.titleMap != null ? - this.props.form.titleMap[0].value : '' - }; - } - - componentWillReceiveProps(nextProps) { - if (nextProps.model && nextProps.form.key) { - this.setState({ - currentValue: this.getModelKey(nextProps.model, nextProps.form.key) - || (nextProps.form.titleMap != null ? nextProps.form.titleMap[0].value : '') - }); + static getDerivedStateFromProps(props: JsonFormFieldProps) { + if (props.model && props.form.key) { + return { + currentValue: ThingsboardSelect.getModelKey(props.model, props.form.key) + || (props.form.titleMap != null ? props.form.titleMap[0].value : '') + } } } - getModelKey(model, key) { + static getModelKey(model: any, key: (string | number)[]) { if (Array.isArray(key)) { - return key.reduce((cur, nxt) => (cur[nxt] || {}), model); + const res = key.reduce((cur, nxt) => (cur[nxt] || {}), model); + if (res && isObject(res)) { + return undefined; + } else { + return res; + } } else { return model[key]; } } - onSelected(event: React.ChangeEvent<{ name?: string; value: any }>) { + constructor(props: JsonFormFieldProps) { + super(props); + this.onSelected = this.onSelected.bind(this); + const possibleValue = ThingsboardSelect.getModelKey(this.props.model, this.props.form.key); + this.state = { + currentValue: this.props.model !== undefined && possibleValue ? possibleValue : this.props.form.titleMap != null ? + this.props.form.titleMap[0].value : '' + }; + } + + onSelected(event: SelectChangeEvent) { this.setState({ currentValue: event.target.value @@ -72,8 +78,9 @@ class ThingsboardSelect extends React.Component - {this.props.form.title} + {this.props.form.title}