Browse Source

Angular 12 migration

pull/5695/head
Igor Kulikov 5 years ago
parent
commit
a69551f067
  1. 4190
      rule-engine/rule-engine-components/src/main/resources/public/static/rulenode/rulenode-core-config.js
  2. 16
      ui-ngx/.browserslistrc
  3. 40
      ui-ngx/angular.json
  4. 14
      ui-ngx/extra-webpack.config.js
  5. 112
      ui-ngx/package.json
  6. 10
      ui-ngx/src/.browserslistrc
  7. 13
      ui-ngx/src/app/core/http/rule-chain.service.ts
  8. 119
      ui-ngx/src/app/core/services/resources.service.ts
  9. 19
      ui-ngx/src/app/modules/common/modules-map.models.ts
  10. 579
      ui-ngx/src/app/modules/common/modules-map.ts
  11. 6
      ui-ngx/src/app/modules/home/components/dashboard-page/states/states-controller.module.ts
  12. 10
      ui-ngx/src/app/modules/home/components/device/device-credentials.module.ts
  13. 3
      ui-ngx/src/app/modules/home/components/entity/entities-table.component.ts
  14. 20
      ui-ngx/src/app/modules/home/components/filter/complex-filter-predicate-dialog.component.ts
  15. 16
      ui-ngx/src/app/modules/home/components/filter/complex-filter-predicate.component.ts
  16. 29
      ui-ngx/src/app/modules/home/components/filter/filter-component.models.ts
  17. 14
      ui-ngx/src/app/modules/home/components/filter/filter-predicate-list.component.ts
  18. 8
      ui-ngx/src/app/modules/home/components/home-components.module.ts
  19. 4
      ui-ngx/src/app/modules/home/components/profile/device/common/device-profile-common.module.ts
  20. 22
      ui-ngx/src/app/modules/home/components/profile/device/lwm2m/lwm2m-profile-components.module.ts
  21. 4
      ui-ngx/src/app/modules/home/components/profile/device/snpm/snmp-device-profile-transport.module.ts
  22. 4
      ui-ngx/src/app/modules/home/components/shared-home-components.module.ts
  23. 27
      ui-ngx/src/app/modules/home/components/tokens.ts
  24. 22
      ui-ngx/src/app/modules/home/components/widget/dialog/custom-dialog.service.ts
  25. 1
      ui-ngx/src/app/modules/home/components/widget/lib/maps/leaflet-map.ts
  26. 1
      ui-ngx/src/app/modules/home/components/widget/lib/rpc/led-indicator.component.scss
  27. 1
      ui-ngx/src/app/modules/home/components/widget/lib/rpc/round-switch.component.scss
  28. 3
      ui-ngx/src/app/modules/home/components/widget/widget-component.service.ts
  29. 10
      ui-ngx/src/app/modules/home/components/widget/widget-components.module.ts
  30. 7
      ui-ngx/src/app/modules/home/components/widget/widget.component.ts
  31. 4
      ui-ngx/src/app/modules/home/home.component.ts
  32. 4
      ui-ngx/src/app/modules/home/models/entity/entities-table-config.models.ts
  33. 85
      ui-ngx/src/app/modules/home/models/entity/entity-table-component.models.ts
  34. 3
      ui-ngx/src/app/modules/home/pages/rulechain/rulechain-routing.module.ts
  35. 2
      ui-ngx/src/app/shared/components/cheatsheet.component.ts
  36. 13
      ui-ngx/src/app/shared/components/fab-toolbar.component.scss
  37. 3
      ui-ngx/src/app/shared/components/hotkeys.directive.ts
  38. 4
      ui-ngx/src/app/shared/components/json-form/react/json-form-react.tsx
  39. 1
      ui-ngx/src/app/shared/components/json-form/react/json-form.scss
  40. 2
      ui-ngx/src/app/shared/components/json-form/react/styles/thingsboardTheme.ts
  41. 10
      ui-ngx/src/app/shared/components/nav-tree.component.ts
  42. 2
      ui-ngx/src/app/shared/components/popover.component.scss
  43. 2
      ui-ngx/src/app/shared/components/tokens.ts
  44. 3
      ui-ngx/src/app/shared/models/constants.ts
  45. 4
      ui-ngx/src/app/shared/shared.module.ts
  46. 1
      ui-ngx/src/scss/animations.scss
  47. 4
      ui-ngx/src/scss/mixins.scss
  48. 9
      ui-ngx/src/theme.scss
  49. 2
      ui-ngx/src/tsconfig.app.json
  50. 20
      ui-ngx/tsconfig.json
  51. 5614
      ui-ngx/yarn.lock

4190
rule-engine/rule-engine-components/src/main/resources/public/static/rulenode/rulenode-core-config.js

File diff suppressed because one or more lines are too long

16
ui-ngx/.browserslistrc

@ -0,0 +1,16 @@
# This file is used by the build system to adjust CSS and JS output to support the specified browsers below.
# For additional information regarding the format and rule options, please see:
# https://github.com/browserslist/browserslist#queries
# For the full list of supported browsers by the Angular framework, please see:
# https://angular.io/guide/browser-support
# You can see what browsers were selected by your queries by running:
# npx browserslist
last 1 Chrome version
last 1 Firefox version
last 2 Edge major versions
last 2 Safari major versions
last 2 iOS major versions
Firefox ESR

40
ui-ngx/angular.json

@ -11,6 +11,9 @@
"schematics": { "schematics": {
"@schematics/angular:component": { "@schematics/angular:component": {
"style": "scss" "style": "scss"
},
"@schematics/angular:application": {
"strict": true
} }
}, },
"architect": { "architect": {
@ -92,6 +95,7 @@
"node_modules/tinycolor2/dist/tinycolor-min.js", "node_modules/tinycolor2/dist/tinycolor-min.js",
"node_modules/split.js/dist/split.min.js", "node_modules/split.js/dist/split.min.js",
"node_modules/systemjs/dist/system.js", "node_modules/systemjs/dist/system.js",
"node_modules/systemjs-babel/dist/systemjs-babel.js",
"node_modules/marked/lib/marked.js", "node_modules/marked/lib/marked.js",
"node_modules/prismjs/prism.js", "node_modules/prismjs/prism.js",
"node_modules/prismjs/components/prism-css.min.js", "node_modules/prismjs/components/prism-css.min.js",
@ -99,7 +103,7 @@
"node_modules/prismjs/components/prism-json.min.js", "node_modules/prismjs/components/prism-json.min.js",
"node_modules/prismjs/components/prism-javascript.min.js", "node_modules/prismjs/components/prism-javascript.min.js",
"node_modules/prismjs/components/prism-typescript.min.js", "node_modules/prismjs/components/prism-typescript.min.js",
"node_modules/prismjs/plugins/line-numbers/prism-line-numbers.js" "node_modules/prismjs/plugins/line-numbers/prism-line-numbers.min.js"
], ],
"customWebpackConfig": { "customWebpackConfig": {
"path": "./extra-webpack.config.js" "path": "./extra-webpack.config.js"
@ -130,7 +134,9 @@
"jquery.terminal", "jquery.terminal",
"tooltipster", "tooltipster",
"jstree", "jstree",
"qrcode" "qrcode",
"wcwidth",
"leaflet-polylinedecorator"
] ]
}, },
"configurations": { "configurations": {
@ -141,7 +147,14 @@
"with": "src/environments/environment.prod.ts" "with": "src/environments/environment.prod.ts"
} }
], ],
"optimization": true, "optimization": {
"scripts": true,
"styles": {
"minify": true,
"inlineCritical": false
},
"fonts": false
},
"outputHashing": "all", "outputHashing": "all",
"sourceMap": false, "sourceMap": false,
"namedChunks": false, "namedChunks": false,
@ -155,6 +168,21 @@
"maximumError": "12mb" "maximumError": "12mb"
} }
] ]
},
"development": {
"buildOptimizer": false,
"optimization": {
"scripts": false,
"styles": {
"minify": false,
"inlineCritical": false
},
"fonts": false
},
"vendorChunk": true,
"extractLicenses": false,
"sourceMap": true,
"namedChunks": true
} }
} }
}, },
@ -167,8 +195,12 @@
"configurations": { "configurations": {
"production": { "production": {
"browserTarget": "thingsboard:build:production" "browserTarget": "thingsboard:build:production"
},
"development": {
"browserTarget": "thingsboard:build:development"
} }
} },
"defaultConfiguration": "development"
}, },
"extract-i18n": { "extract-i18n": {
"builder": "@angular-devkit/build-angular:extract-i18n", "builder": "@angular-devkit/build-angular:extract-i18n",

14
ui-ngx/extra-webpack.config.js

@ -14,7 +14,7 @@
* limitations under the License. * limitations under the License.
*/ */
const CompressionPlugin = require("compression-webpack-plugin"); const CompressionPlugin = require("compression-webpack-plugin");
const TerserPlugin = require("terser-webpack-plugin"); const JavaScriptOptimizerPlugin = require("@angular-devkit/build-angular/src/webpack/plugins/javascript-optimizer-plugin").JavaScriptOptimizerPlugin;
const webpack = require("webpack"); const webpack = require("webpack");
const dirTree = require("directory-tree"); const dirTree = require("directory-tree");
const ngWebpack = require('@ngtools/webpack'); const ngWebpack = require('@ngtools/webpack');
@ -52,7 +52,10 @@ module.exports = (config, options) => {
}) })
); );
config.plugins.push( config.plugins.push(
new webpack.IgnorePlugin(/^\.\/locale$/, /moment$/) new webpack.IgnorePlugin({
resourceRegExp: /^\.\/locale$/,
contextRegExp: /moment$/,
})
); );
if (config.mode === 'production') { if (config.mode === 'production') {
@ -62,11 +65,10 @@ module.exports = (config, options) => {
angularCompilerOptions.emitNgModuleScope = true; angularCompilerOptions.emitNgModuleScope = true;
config.plugins.splice(index, 1); config.plugins.splice(index, 1);
config.plugins.push(new ngWebpack.ivy.AngularWebpackPlugin(angularCompilerOptions)); config.plugins.push(new ngWebpack.ivy.AngularWebpackPlugin(angularCompilerOptions));
const terserPluginOptions = config.optimization.minimizer[1].options; const javascriptOptimizerOptions = config.optimization.minimizer[1].options;
delete terserPluginOptions.terserOptions.compress.global_defs.ngJitMode; delete javascriptOptimizerOptions.define.ngJitMode;
terserPluginOptions.terserOptions.compress.side_effects = false;
config.optimization.minimizer.splice(1, 1); config.optimization.minimizer.splice(1, 1);
config.optimization.minimizer.push(new TerserPlugin(terserPluginOptions)); config.optimization.minimizer.push(new JavaScriptOptimizerPlugin(javascriptOptimizerOptions));
} }
return config; return config;
}; };

112
ui-ngx/package.json

@ -3,7 +3,7 @@
"version": "3.3.3", "version": "3.3.3",
"scripts": { "scripts": {
"ng": "ng", "ng": "ng",
"start": "node --max_old_space_size=8048 ./node_modules/@angular/cli/bin/ng serve --host 0.0.0.0 --open", "start": "node --max_old_space_size=8048 ./node_modules/@angular/cli/bin/ng serve --configuration development --host 0.0.0.0 --open",
"build": "ng build", "build": "ng build",
"build:prod": "ng build --configuration production --vendor-chunk", "build:prod": "ng build --configuration production --vendor-chunk",
"test": "ng test", "test": "ng test",
@ -25,13 +25,13 @@
"@angular/platform-browser-dynamic": "^12.2.13", "@angular/platform-browser-dynamic": "^12.2.13",
"@angular/router": "^12.2.13", "@angular/router": "^12.2.13",
"@auth0/angular-jwt": "^5.0.2", "@auth0/angular-jwt": "^5.0.2",
"@date-io/date-fns": "^2.10.11", "@date-io/date-fns": "^2.11.0",
"@flowjs/flow.js": "^2.14.1", "@flowjs/flow.js": "^2.14.1",
"@flowjs/ngx-flow": "~0.4.6", "@flowjs/ngx-flow": "~0.4.6",
"@geoman-io/leaflet-geoman-free": "^2.11.3", "@geoman-io/leaflet-geoman-free": "^2.11.3",
"@juggle/resize-observer": "^3.3.1", "@juggle/resize-observer": "^3.3.1",
"@mat-datetimepicker/core": "~7.0.1", "@mat-datetimepicker/core": "~7.0.1",
"@material-ui/core": "^4.11.4", "@material-ui/core": "^4.12.3",
"@material-ui/icons": "^4.11.2", "@material-ui/icons": "^4.11.2",
"@material-ui/pickers": "^3.3.10", "@material-ui/pickers": "^3.3.10",
"@ngrx/effects": "^12.5.1", "@ngrx/effects": "^12.5.1",
@ -39,24 +39,23 @@
"@ngrx/store-devtools": "^12.5.1", "@ngrx/store-devtools": "^12.5.1",
"@ngx-translate/core": "^13.0.0", "@ngx-translate/core": "^13.0.0",
"@ngx-translate/http-loader": "^6.0.0", "@ngx-translate/http-loader": "^6.0.0",
"ace-builds": "^1.4.12", "ace-builds": "^1.4.13",
"angular-gridster2": "~11.2.0", "angular-gridster2": "~12.1.1",
"angular2-hotkeys": "^2.4.0", "angular2-hotkeys": "^2.4.0",
"canvas-gauges": "^2.1.7", "canvas-gauges": "^2.1.7",
"compass-sass-mixins": "^0.12.7", "core-js": "^3.19.2",
"core-js": "^3.18.3", "date-fns": "^2.26.0",
"date-fns": "^2.21.3",
"flot": "git://github.com/thingsboard/flot.git#0.9-work", "flot": "git://github.com/thingsboard/flot.git#0.9-work",
"flot.curvedlines": "git://github.com/MichaelZinsmaier/CurvedLines.git#master", "flot.curvedlines": "git://github.com/MichaelZinsmaier/CurvedLines.git#master",
"font-awesome": "^4.7.0", "font-awesome": "^4.7.0",
"html2canvas": "^1.0.0-rc.7", "html2canvas": "^1.3.3",
"jquery": "^3.5.1", "jquery": "^3.6.0",
"jquery.terminal": "^2.24.0", "jquery.terminal": "^2.29.4",
"js-beautify": "^1.13.13", "js-beautify": "^1.14.0",
"json-schema-defaults": "^0.4.0", "json-schema-defaults": "^0.4.0",
"jstree": "^3.3.11", "jstree": "^3.3.12",
"jstree-bootstrap-theme": "^1.0.1", "jstree-bootstrap-theme": "^1.0.1",
"jszip": "^3.6.0", "jszip": "^3.7.1",
"leaflet": "^1.7.1", "leaflet": "^1.7.1",
"leaflet-polylinedecorator": "^1.6.0", "leaflet-polylinedecorator": "^1.6.0",
"leaflet-providers": "^1.13.0", "leaflet-providers": "^1.13.0",
@ -65,82 +64,85 @@
"material-design-icons": "^3.0.1", "material-design-icons": "^3.0.1",
"messageformat": "^2.3.0", "messageformat": "^2.3.0",
"moment": "^2.29.1", "moment": "^2.29.1",
"moment-timezone": "^0.5.33", "moment-timezone": "^0.5.34",
"mousetrap": "1.6.3", "ngx-clipboard": "^14.0.2",
"ngx-clipboard": "^14.0.1",
"ngx-color-picker": "^11.0.0", "ngx-color-picker": "^11.0.0",
"ngx-daterangepicker-material": "^4.0.1", "ngx-daterangepicker-material": "^5.0.1",
"ngx-drag-drop": "^2.0.0", "ngx-drag-drop": "^2.0.0",
"ngx-flowchart": "git://github.com/thingsboard/ngx-flowchart.git#master", "ngx-flowchart": "git://github.com/thingsboard/ngx-flowchart.git#master",
"ngx-hm-carousel": "^2.0.0-rc.1", "ngx-hm-carousel": "^2.0.1",
"ngx-markdown": "^11.1.3", "ngx-markdown": "^12.0.1",
"ngx-sharebuttons": "^8.0.5", "ngx-sharebuttons": "^9.0.0",
"ngx-translate-messageformat-compiler": "^4.9.0", "ngx-translate-messageformat-compiler": "^4.11.0",
"objectpath": "^2.0.0", "objectpath": "^2.0.0",
"prettier": "^2.1.2", "prettier": "^2.5.0",
"prop-types": "^15.7.2", "prop-types": "^15.7.2",
"qrcode": "^1.4.4", "qrcode": "^1.5.0",
"raphael": "^2.3.0", "raphael": "^2.3.0",
"rc-select": "~10.5.1", "rc-select": "~13.2.0",
"react": "~16.14.0", "react": "~17.0.2",
"react-ace": "^9.1.4", "react-ace": "^9.5.0",
"react-dom": "^16.13.1", "react-dom": "^17.0.2",
"react-dropzone": "^11.2.0", "react-dropzone": "^11.4.2",
"reactcss": "^1.2.3", "reactcss": "^1.2.3",
"rxjs": "~6.6.7", "rxjs": "~6.6.7",
"schema-inspector": "^2.0.1", "schema-inspector": "^2.0.1",
"screenfull": "^5.1.0", "screenfull": "^6.0.0",
"split.js": "^1.6.4", "split.js": "^1.6.4",
"systemjs": "0.21.5", "systemjs": "6.11.0",
"systemjs-babel": "^0.3.1",
"tinycolor2": "^1.4.2", "tinycolor2": "^1.4.2",
"tooltipster": "^4.2.8", "tooltipster": "^4.2.8",
"tslib": "^2.2.0", "tslib": "^2.3.1",
"tv4": "^1.3.0", "tv4": "^1.3.0",
"typeface-roboto": "^1.1.13", "typeface-roboto": "^1.1.13",
"zone.js": "~0.11.4" "zone.js": "~0.11.4"
}, },
"devDependencies": { "devDependencies": {
"@angular-builders/custom-webpack": "~11.1.1", "@angular-builders/custom-webpack": "~12.1.3",
"@angular-devkit/build-angular": "^12.2.13", "@angular-devkit/build-angular": "^12.2.13",
"@angular/cli": "^12.2.13", "@angular/cli": "^12.2.13",
"@angular/compiler-cli": "^12.2.13", "@angular/compiler-cli": "^12.2.13",
"@angular/language-service": "^12.2.13", "@angular/language-service": "^12.2.13",
"@ngtools/webpack": "~12.2.13", "@ngtools/webpack": "~12.2.13",
"@types/canvas-gauges": "^2.1.2", "@types/canvas-gauges": "^2.1.4",
"@types/flot": "^0.0.31", "@types/flot": "^0.0.32",
"@types/jasmine": "~3.7.4", "@types/jasmine": "~3.10.2",
"@types/jasminewd2": "^2.0.9", "@types/jasminewd2": "^2.0.10",
"@types/jquery": "^3.5.2", "@types/jquery": "^3.5.9",
"@types/js-beautify": "^1.13.1", "@types/js-beautify": "^1.13.3",
"@types/jstree": "^3.3.40", "@types/jstree": "^3.3.41",
"@types/leaflet": "^1.7.6", "@types/leaflet": "^1.7.6",
"@types/leaflet-polylinedecorator": "^1.6.1", "@types/leaflet-polylinedecorator": "^1.6.1",
"@types/leaflet-providers": "^1.2.1", "@types/leaflet-providers": "^1.2.1",
"@types/leaflet.gridlayer.googlemutant": "^0.4.6", "@types/leaflet.gridlayer.googlemutant": "^0.4.6",
"@types/leaflet.markercluster": "^1.4.6", "@types/leaflet.markercluster": "^1.4.6",
"@types/lodash": "^4.14.170", "@types/lodash": "^4.14.177",
"@types/moment-timezone": "^0.5.30", "@types/moment-timezone": "^0.5.30",
"@types/mousetrap": "1.6.3", "@types/mousetrap": "^1.6.0",
"@types/raphael": "^2.3.1", "@types/node": "~15.14.9",
"@types/react": "^16.9.51", "@types/raphael": "^2.3.2",
"@types/react-dom": "^16.9.8", "@types/react": "^17.0.37",
"@types/tinycolor2": "^1.4.2", "@types/react-dom": "^17.0.11",
"@types/tooltipster": "^0.0.30", "@types/systemjs": "6.1.1",
"@types/tinycolor2": "^1.4.3",
"@types/tooltipster": "^0.0.31",
"codelyzer": "^6.0.2", "codelyzer": "^6.0.2",
"compression-webpack-plugin": "^6.1.1", "compression-webpack-plugin": "^9.0.1",
"directory-tree": "^2.2.4", "directory-tree": "^3.0.1",
"jasmine-core": "~3.7.1", "jasmine-core": "~3.10.1",
"jasmine-spec-reporter": "~7.0.0", "jasmine-spec-reporter": "~7.0.0",
"karma": "~6.3.2", "karma": "~6.3.9",
"karma-chrome-launcher": "~3.1.0", "karma-chrome-launcher": "~3.1.0",
"karma-coverage-istanbul-reporter": "~3.0.3", "karma-coverage-istanbul-reporter": "~3.0.3",
"karma-jasmine": "~4.0.0", "karma-jasmine": "~4.0.1",
"karma-jasmine-html-reporter": "^1.5.0", "karma-jasmine-html-reporter": "^1.7.0",
"ngrx-store-freeze": "^0.2.4", "ngrx-store-freeze": "^0.2.4",
"patch-package": "^6.4.7", "patch-package": "^6.4.7",
"postinstall-prepare": "^2.0.0", "postinstall-prepare": "^2.0.0",
"protractor": "~7.0.0", "protractor": "~7.0.0",
"ts-node": "^9.0.0", "raw-loader": "^4.0.2",
"ts-node": "^10.4.0",
"tslint": "~6.1.3", "tslint": "~6.1.3",
"typescript": "~4.3.5", "typescript": "~4.3.5",
"webpack": "^5.64.4" "webpack": "^5.64.4"
@ -148,4 +150,4 @@
"resolutions": { "resolutions": {
"lodash": "~4.17.21" "lodash": "~4.17.21"
} }
} }

10
ui-ngx/src/.browserslistrc

@ -1,10 +0,0 @@
# This file is currently used by autoprefixer to adjust CSS to support the below specified browsers
# For additional information regarding the format and rule options, please see:
# https://github.com/browserslist/browserslist#queries
#
# For IE 9-11 support, please remove 'not' from the last line of the file and adjust as needed
> 0.5%
last 2 versions
Firefox ESR
not dead

13
ui-ngx/src/app/core/http/rule-chain.service.ts

@ -45,6 +45,7 @@ import { EntityType } from '@shared/models/entity-type.models';
import { deepClone, snakeCase } from '@core/utils'; import { deepClone, snakeCase } from '@core/utils';
import { DebugRuleNodeEventBody } from '@app/shared/models/event.models'; import { DebugRuleNodeEventBody } from '@app/shared/models/event.models';
import { Edge } from '@shared/models/edge.models'; import { Edge } from '@shared/models/edge.models';
import { IModulesMap } from '@modules/common/modules-map.models';
@Injectable({ @Injectable({
providedIn: 'root' providedIn: 'root'
@ -119,14 +120,14 @@ export class RuleChainService {
); );
} }
public getRuleNodeComponents(ruleNodeConfigResourcesModulesMap: {[key: string]: any}, ruleChainType: RuleChainType, config?: RequestConfig): public getRuleNodeComponents(modulesMap: IModulesMap, ruleChainType: RuleChainType, config?: RequestConfig):
Observable<Array<RuleNodeComponentDescriptor>> { Observable<Array<RuleNodeComponentDescriptor>> {
if (this.ruleNodeComponentsMap.get(ruleChainType)) { if (this.ruleNodeComponentsMap.get(ruleChainType)) {
return of(this.ruleNodeComponentsMap.get(ruleChainType)); return of(this.ruleNodeComponentsMap.get(ruleChainType));
} else { } else {
return this.loadRuleNodeComponents(ruleChainType, config).pipe( return this.loadRuleNodeComponents(ruleChainType, config).pipe(
mergeMap((components) => { mergeMap((components) => {
return this.resolveRuleNodeComponentsUiResources(components, ruleNodeConfigResourcesModulesMap).pipe( return this.resolveRuleNodeComponentsUiResources(components, modulesMap).pipe(
map((ruleNodeComponents) => { map((ruleNodeComponents) => {
this.ruleNodeComponentsMap.set(ruleChainType, ruleNodeComponents); this.ruleNodeComponentsMap.set(ruleChainType, ruleNodeComponents);
this.ruleNodeComponentsMap.get(ruleChainType).push(ruleChainNodeComponent); this.ruleNodeComponentsMap.get(ruleChainType).push(ruleChainNodeComponent);
@ -220,11 +221,11 @@ export class RuleChainService {
} }
private resolveRuleNodeComponentsUiResources(components: Array<RuleNodeComponentDescriptor>, private resolveRuleNodeComponentsUiResources(components: Array<RuleNodeComponentDescriptor>,
ruleNodeConfigResourcesModulesMap: {[key: string]: any}): modulesMap: IModulesMap):
Observable<Array<RuleNodeComponentDescriptor>> { Observable<Array<RuleNodeComponentDescriptor>> {
const tasks: Observable<RuleNodeComponentDescriptor>[] = []; const tasks: Observable<RuleNodeComponentDescriptor>[] = [];
components.forEach((component) => { components.forEach((component) => {
tasks.push(this.resolveRuleNodeComponentUiResources(component, ruleNodeConfigResourcesModulesMap)); tasks.push(this.resolveRuleNodeComponentUiResources(component, modulesMap));
}); });
return forkJoin(tasks).pipe( return forkJoin(tasks).pipe(
catchError((err) => { catchError((err) => {
@ -234,7 +235,7 @@ export class RuleChainService {
} }
private resolveRuleNodeComponentUiResources(component: RuleNodeComponentDescriptor, private resolveRuleNodeComponentUiResources(component: RuleNodeComponentDescriptor,
ruleNodeConfigResourcesModulesMap: {[key: string]: any}): modulesMap: IModulesMap):
Observable<RuleNodeComponentDescriptor> { Observable<RuleNodeComponentDescriptor> {
const nodeDefinition = component.configurationDescriptor.nodeDefinition; const nodeDefinition = component.configurationDescriptor.nodeDefinition;
const uiResources = nodeDefinition.uiResources; const uiResources = nodeDefinition.uiResources;
@ -248,7 +249,7 @@ export class RuleChainService {
}); });
} }
if (moduleResource) { if (moduleResource) {
tasks.push(this.resourcesService.loadFactories(moduleResource, ruleNodeConfigResourcesModulesMap).pipe( tasks.push(this.resourcesService.loadFactories(moduleResource, modulesMap).pipe(
map((res) => { map((res) => {
if (nodeDefinition.configDirective && nodeDefinition.configDirective.length) { if (nodeDefinition.configDirective && nodeDefinition.configDirective.length) {
const selector = snakeCase(nodeDefinition.configDirective, '-'); const selector = snakeCase(nodeDefinition.configDirective, '-');

119
ui-ngx/src/app/core/services/resources.service.ts

@ -26,8 +26,9 @@ import {
import { DOCUMENT } from '@angular/common'; import { DOCUMENT } from '@angular/common';
import { forkJoin, Observable, ReplaySubject, throwError } from 'rxjs'; import { forkJoin, Observable, ReplaySubject, throwError } from 'rxjs';
import { HttpClient } from '@angular/common/http'; import { HttpClient } from '@angular/common/http';
import { IModulesMap } from '@modules/common/modules-map.models';
declare const SystemJS; declare const System;
@Injectable({ @Injectable({
providedIn: 'root' providedIn: 'root'
@ -63,23 +64,19 @@ export class ResourcesService {
return this.loadResourceByType(fileType, url); return this.loadResourceByType(fileType, url);
} }
public loadFactories(url: string, modulesMap: {[key: string]: any}): Observable<ComponentFactory<any>[]> { public loadFactories(url: string, modulesMap: IModulesMap): Observable<ComponentFactory<any>[]> {
if (this.loadedFactories[url]) { if (this.loadedFactories[url]) {
return this.loadedFactories[url].asObservable(); return this.loadedFactories[url].asObservable();
} }
modulesMap.init();
const subject = new ReplaySubject<ComponentFactory<any>[]>(); const subject = new ReplaySubject<ComponentFactory<any>[]>();
this.loadedFactories[url] = subject; this.loadedFactories[url] = subject;
if (modulesMap) { import('@angular/compiler').then(
for (const moduleId of Object.keys(modulesMap)) { () => {
SystemJS.set(moduleId, modulesMap[moduleId]); System.import(url).then(
} (module) => {
} const modules = this.extractNgModules(module);
SystemJS.import(url).then( if (modules.length) {
(module) => {
const modules = this.extractNgModules(module);
if (modules.length) {
import('@angular/compiler').then(
() => {
const tasks: Promise<ModuleWithComponentFactories<any>>[] = []; const tasks: Promise<ModuleWithComponentFactories<any>>[] = [];
for (const m of modules) { for (const m of modules) {
tasks.push(this.compiler.compileModuleAndAllComponentsAsync(m)); tasks.push(this.compiler.compileModuleAndAllComponentsAsync(m));
@ -101,44 +98,41 @@ export class ResourcesService {
(e) => { (e) => {
this.loadedFactories[url].error(new Error(`Unable to compile module from url: ${url}`)); this.loadedFactories[url].error(new Error(`Unable to compile module from url: ${url}`));
delete this.loadedFactories[url]; delete this.loadedFactories[url];
}); } });
); } else {
} else { this.loadedFactories[url].error(new Error(`Module '${url}' doesn't have default export!`));
this.loadedFactories[url].error(new Error(`Module '${url}' doesn't have default export!`)); delete this.loadedFactories[url];
delete this.loadedFactories[url]; }
} },
}, (e) => {
(e) => { this.loadedFactories[url].error(new Error(`Unable to load module from url: ${url}`));
this.loadedFactories[url].error(new Error(`Unable to load module from url: ${url}`)); delete this.loadedFactories[url];
delete this.loadedFactories[url]; }
);
} }
); );
return subject.asObservable(); return subject.asObservable();
} }
public loadModules(url: string, modulesMap: {[key: string]: any}): Observable<Type<any>[]> { public loadModules(url: string, modulesMap: IModulesMap): Observable<Type<any>[]> {
if (this.loadedModules[url]) { if (this.loadedModules[url]) {
return this.loadedModules[url].asObservable(); return this.loadedModules[url].asObservable();
} }
modulesMap.init();
const subject = new ReplaySubject<Type<any>[]>(); const subject = new ReplaySubject<Type<any>[]>();
this.loadedModules[url] = subject; this.loadedModules[url] = subject;
if (modulesMap) { import('@angular/compiler').then(
for (const moduleId of Object.keys(modulesMap)) { () => {
SystemJS.set(moduleId, modulesMap[moduleId]); System.import(url).then(
} (module) => {
} try {
SystemJS.import(url).then( let modules;
(module) => { try {
try { modules = this.extractNgModules(module);
let modules; } catch (e) {
try { console.error(e);
modules = this.extractNgModules(module); }
} catch (e) { if (modules && modules.length) {
console.error(e);
}
if (modules && modules.length) {
import('@angular/compiler').then(
() => {
const tasks: Promise<ModuleWithComponentFactories<any>>[] = []; const tasks: Promise<ModuleWithComponentFactories<any>>[] = [];
for (const m of modules) { for (const m of modules) {
tasks.push(this.compiler.compileModuleAndAllComponentsAsync(m)); tasks.push(this.compiler.compileModuleAndAllComponentsAsync(m));
@ -159,21 +153,21 @@ export class ResourcesService {
this.loadedModules[url].error(new Error(`Unable to compile module from url: ${url}`)); this.loadedModules[url].error(new Error(`Unable to compile module from url: ${url}`));
delete this.loadedModules[url]; delete this.loadedModules[url];
}); });
} else {
this.loadedModules[url].error(new Error(`Module '${url}' doesn't have default export or not NgModule!`));
delete this.loadedModules[url];
} }
); } catch (e) {
} else { this.loadedModules[url].error(new Error(`Unable to load module from url: ${url}`));
this.loadedModules[url].error(new Error(`Module '${url}' doesn't have default export or not NgModule!`)); delete this.loadedModules[url];
}
},
(e) => {
this.loadedModules[url].error(new Error(`Unable to load module from url: ${url}`));
delete this.loadedModules[url]; delete this.loadedModules[url];
console.error(`Unable to load module from url: ${url}`, e);
} }
} catch (e) { );
this.loadedModules[url].error(new Error(`Unable to load module from url: ${url}`));
delete this.loadedModules[url];
}
},
(e) => {
this.loadedModules[url].error(new Error(`Unable to load module from url: ${url}`));
delete this.loadedModules[url];
console.error(`Unable to load module from url: ${url}`, e);
} }
); );
return subject.asObservable(); return subject.asObservable();
@ -184,24 +178,23 @@ export class ResourcesService {
let potentialModules = [module]; let potentialModules = [module];
let currentScanDepth = 0; let currentScanDepth = 0;
while(potentialModules.length && currentScanDepth < 10) { while (potentialModules.length && currentScanDepth < 10) {
let newPotentialModules = []; const newPotentialModules = [];
for (const module of potentialModules) { for (const potentialModule of potentialModules) {
if (module && 'ɵmod' in module) { if (potentialModule && ('ɵmod' in potentialModule)) {
modules.push(module); modules.push(potentialModule);
} else { } else {
for (const k of Object.keys(module)) { for (const k of Object.keys(potentialModule)) {
if(!this.isPrimitive(module[k])) { if (!this.isPrimitive(potentialModule[k])) {
newPotentialModules.push(module[k]); newPotentialModules.push(potentialModule[k]);
} }
} }
} }
} }
potentialModules = newPotentialModules; potentialModules = newPotentialModules;
currentScanDepth++; currentScanDepth++;
} }
} catch(e) { } catch (e) {
console.log('Could not load NgModule', e); console.log('Could not load NgModule', e);
} }
return modules; return modules;

19
ui-ngx/src/app/modules/common/modules-map.models.ts

@ -0,0 +1,19 @@
///
/// Copyright © 2016-2021 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.
///
export interface IModulesMap {
init(): void;
}

579
ui-ngx/src/app/modules/common/modules-map.ts

@ -19,6 +19,9 @@ import * as AngularCore from '@angular/core';
import * as AngularCommon from '@angular/common'; import * as AngularCommon from '@angular/common';
import * as AngularForms from '@angular/forms'; import * as AngularForms from '@angular/forms';
import * as AngularFlexLayout from '@angular/flex-layout'; import * as AngularFlexLayout from '@angular/flex-layout';
import * as AngularFlexLayoutFlex from '@angular/flex-layout/flex';
import * as AngularFlexLayoutGrid from '@angular/flex-layout/grid';
import * as AngularFlexLayoutExtended from '@angular/flex-layout/extended';
import * as AngularPlatformBrowser from '@angular/platform-browser'; import * as AngularPlatformBrowser from '@angular/platform-browser';
import * as AngularRouter from '@angular/router'; import * as AngularRouter from '@angular/router';
import * as AngularCdkCoercion from '@angular/cdk/coercion'; import * as AngularCdkCoercion from '@angular/cdk/coercion';
@ -62,76 +65,520 @@ import * as AngularMaterialTabs from '@angular/material/tabs';
import * as AngularMaterialToolbar from '@angular/material/toolbar'; import * as AngularMaterialToolbar from '@angular/material/toolbar';
import * as AngularMaterialTooltip from '@angular/material/tooltip'; import * as AngularMaterialTooltip from '@angular/material/tooltip';
import * as AngularMaterialTree from '@angular/material/tree'; import * as AngularMaterialTree from '@angular/material/tree';
import * as DragDropModule from '@angular/cdk/drag-drop';
import * as HttpClientModule from '@angular/common/http';
import * as NgrxStore from '@ngrx/store'; import * as NgrxStore from '@ngrx/store';
import * as RxJs from 'rxjs'; import * as RxJs from 'rxjs';
import * as RxJsOperators from 'rxjs/operators'; import * as RxJsOperators from 'rxjs/operators';
import * as TranslateCore from '@ngx-translate/core'; import * as TranslateCore from '@ngx-translate/core';
import * as _moment from 'moment';
import * as TbCore from '@core/public-api'; import * as TbCore from '@core/public-api';
import * as TbShared from '@shared/public-api'; import * as TbShared from '@shared/public-api';
import * as TbHomeComponents from '@home/components/public-api'; import * as TbHomeComponents from '@home/components/public-api';
import * as _moment from 'moment';
import * as DragDropModule from "@angular/cdk/drag-drop"; import * as MillisecondsToTimeStringPipe from '@shared/pipe/milliseconds-to-time-string.pipe';
import * as HttpClientModule from "@angular/common/http"; import * as EnumToArrayPipe from '@shared/pipe/enum-to-array.pipe';
import * as HighlightPipe from '@shared/pipe/highlight.pipe';
declare const SystemJS; import * as TruncatePipe from '@shared/pipe/truncate.pipe';
import * as TbJsonPipe from '@shared/pipe/tbJson.pipe';
export const modulesMap: {[key: string]: any} = { import * as FileSizePipe from '@shared/pipe/file-size.pipe';
'@angular/animations': SystemJS.newModule(AngularAnimations), import * as NospacePipe from '@shared/pipe/nospace.pipe';
'@angular/core': SystemJS.newModule(AngularCore), import * as SelectableColumnsPipe from '@shared/pipe/selectable-columns.pipe';
'@angular/common': SystemJS.newModule(AngularCommon), import * as KeyboardShortcutPipe from '@shared/pipe/keyboard-shortcut.pipe';
'@angular/common/http': SystemJS.newModule(HttpClientModule),
'@angular/forms': SystemJS.newModule(AngularForms), import * as FooterComponent from '@shared/components/footer.component';
'@angular/flex-layout': SystemJS.newModule(AngularFlexLayout), import * as LogoComponent from '@shared/components/logo.component';
'@angular/platform-browser': SystemJS.newModule(AngularPlatformBrowser), import * as FooterFabButtonsComponent from '@shared/components/footer-fab-buttons.component';
'@angular/router': SystemJS.newModule(AngularRouter), import * as FullscreenDirective from '@shared/components/fullscreen.directive';
'@angular/cdk/coercion': SystemJS.newModule(AngularCdkCoercion), import * as CircularProgressDirective from '@shared/components/circular-progress.directive';
'@angular/cdk/collections': SystemJS.newModule(AngularCdkCollections), import * as MatChipDraggableDirective from '@shared/components/mat-chip-draggable.directive';
'@angular/cdk/keycodes': SystemJS.newModule(AngularCdkKeycodes), import * as TbHotkeysDirective from '@shared/components/hotkeys.directive';
'@angular/cdk/layout': SystemJS.newModule(AngularCdkLayout), import * as TbAnchorComponent from '@shared/components/tb-anchor.component';
'@angular/cdk/overlay': SystemJS.newModule(AngularCdkOverlay), import * as TbPopoverComponent from '@shared/components/popover.component';
'@angular/cdk/portal': SystemJS.newModule(AngularCdkPortal), import * as TbStringTemplateOutletDirective from '@shared/components/directives/sring-template-outlet.directive';
'@angular/cdk/drag-drop': SystemJS.newModule(DragDropModule), import * as TbComponentOutletDirective from '@shared/components/directives/component-outlet.directive';
'@angular/material/autocomplete': SystemJS.newModule(AngularMaterialAutocomplete), import * as TbMarkdownComponent from '@shared/components/markdown.component';
'@angular/material/badge': SystemJS.newModule(AngularMaterialBadge), import * as HelpComponent from '@shared/components/help.component';
'@angular/material/bottom-sheet': SystemJS.newModule(AngularMaterialBottomSheet), import * as HelpMarkdownComponent from '@shared/components/help-markdown.component';
'@angular/material/button': SystemJS.newModule(AngularMaterialButton), import * as HelpPopupComponent from '@shared/components/help-popup.component';
'@angular/material/button-toggle': SystemJS.newModule(AngularMaterialButtonToggle), import * as TbCheckboxComponent from '@shared/components/tb-checkbox.component';
'@angular/material/card': SystemJS.newModule(AngularMaterialCard), import * as TbToast from '@shared/components/toast.directive';
'@angular/material/checkbox': SystemJS.newModule(AngularMaterialCheckbox), import * as TbErrorComponent from '@shared/components/tb-error.component';
'@angular/material/chips': SystemJS.newModule(AngularMaterialChips), import * as TbCheatSheetComponent from '@shared/components/cheatsheet.component';
'@angular/material/core': SystemJS.newModule(AngularMaterialCore), import * as BreadcrumbComponent from '@shared/components/breadcrumb.component';
'@angular/material/datepicker': SystemJS.newModule(AngularMaterialDatepicker), import * as UserMenuComponent from '@shared/components/user-menu.component';
'@angular/material/dialog': SystemJS.newModule(AngularMaterialDialog), import * as TimewindowComponent from '@shared/components/time/timewindow.component';
'@angular/material/divider': SystemJS.newModule(AngularMaterialDivider), import * as TimewindowPanelComponent from '@shared/components/time/timewindow-panel.component';
'@angular/material/expansion': SystemJS.newModule(AngularMaterialExpansion), import * as TimeintervalComponent from '@shared/components/time/timeinterval.component';
'@angular/material/form-field': SystemJS.newModule(AngularMaterialFormField), import * as QuickTimeIntervalComponent from '@shared/components/time/quick-time-interval.component';
'@angular/material/grid-list': SystemJS.newModule(AngularMaterialGridList), import * as DashboardSelectComponent from '@shared/components/dashboard-select.component';
'@angular/material/icon': SystemJS.newModule(AngularMaterialIcon), import * as DashboardSelectPanelComponent from '@shared/components/dashboard-select-panel.component';
'@angular/material/input': SystemJS.newModule(AngularMaterialInput), import * as DatetimePeriodComponent from '@shared/components/time/datetime-period.component';
'@angular/material/list': SystemJS.newModule(AngularMaterialList), import * as DatetimeComponent from '@shared/components/time/datetime.component';
'@angular/material/menu': SystemJS.newModule(AngularMaterialMenu), import * as TimezoneSelectComponent from '@shared/components/time/timezone-select.component';
'@angular/material/paginator': SystemJS.newModule(AngularMaterialPaginator), import * as ValueInputComponent from '@shared/components/value-input.component';
'@angular/material/progress-bar': SystemJS.newModule(AngularMaterialProgressBar), import * as DashboardAutocompleteComponent from '@shared/components/dashboard-autocomplete.component';
'@angular/material/progress-spinner': SystemJS.newModule(AngularMaterialProgressSpinner), import * as EntitySubTypeAutocompleteComponent from '@shared/components/entity/entity-subtype-autocomplete.component';
'@angular/material/radio': SystemJS.newModule(AngularMaterialRadio), import * as EntitySubTypeSelectComponent from '@shared/components/entity/entity-subtype-select.component';
'@angular/material/select': SystemJS.newModule(AngularMaterialSelect), import * as EntitySubTypeListComponent from '@shared/components/entity/entity-subtype-list.component';
'@angular/material/sidenav': SystemJS.newModule(AngularMaterialSidenav), import * as EntityAutocompleteComponent from '@shared/components/entity/entity-autocomplete.component';
'@angular/material/slide-toggle': SystemJS.newModule(AngularMaterialSlideToggle), import * as EntityListComponent from '@shared/components/entity/entity-list.component';
'@angular/material/slider': SystemJS.newModule(AngularMaterialSlider), import * as EntityTypeSelectComponent from '@shared/components/entity/entity-type-select.component';
'@angular/material/snack-bar': SystemJS.newModule(AngularMaterialSnackBar), import * as EntitySelectComponent from '@shared/components/entity/entity-select.component';
'@angular/material/sort': SystemJS.newModule(AngularMaterialSort), import * as EntityKeysListComponent from '@shared/components/entity/entity-keys-list.component';
'@angular/material/stepper': SystemJS.newModule(AngularMaterialStepper), import * as EntityListSelectComponent from '@shared/components/entity/entity-list-select.component';
'@angular/material/table': SystemJS.newModule(AngularMaterialTable), import * as EntityTypeListComponent from '@shared/components/entity/entity-type-list.component';
'@angular/material/tabs': SystemJS.newModule(AngularMaterialTabs), import * as QueueTypeListComponent from '@shared/components/queue/queue-type-list.component';
'@angular/material/toolbar': SystemJS.newModule(AngularMaterialToolbar), import * as RelationTypeAutocompleteComponent from '@shared/components/relation/relation-type-autocomplete.component';
'@angular/material/tooltip': SystemJS.newModule(AngularMaterialTooltip), import * as SocialSharePanelComponent from '@shared/components/socialshare-panel.component';
'@angular/material/tree': SystemJS.newModule(AngularMaterialTree), import * as JsonObjectEditComponent from '@shared/components/json-object-edit.component';
'@ngrx/store': SystemJS.newModule(NgrxStore), import * as JsonContentComponent from '@shared/components/json-content.component';
rxjs: SystemJS.newModule(RxJs), import * as JsFuncComponent from '@shared/components/js-func.component';
'rxjs/operators': SystemJS.newModule(RxJsOperators), import * as FabToolbarComponent from '@shared/components/fab-toolbar.component';
'@ngx-translate/core': SystemJS.newModule(TranslateCore), import * as WidgetsBundleSelectComponent from '@shared/components/widgets-bundle-select.component';
'@core/public-api': SystemJS.newModule(TbCore), import * as ConfirmDialogComponent from '@shared/components/dialog/confirm-dialog.component';
'@shared/public-api': SystemJS.newModule(TbShared), import * as AlertDialogComponent from '@shared/components/dialog/alert-dialog.component';
'@home/components/public-api': SystemJS.newModule(TbHomeComponents), import * as TodoDialogComponent from '@shared/components/dialog/todo-dialog.component';
moment: SystemJS.newModule(_moment) import * as ColorPickerDialogComponent from '@shared/components/dialog/color-picker-dialog.component';
}; import * as MaterialIconsDialogComponent from '@shared/components/dialog/material-icons-dialog.component';
import * as ColorInputComponent from '@shared/components/color-input.component';
import * as MaterialIconSelectComponent from '@shared/components/material-icon-select.component';
import * as NodeScriptTestDialogComponent from '@shared/components/dialog/node-script-test-dialog.component';
import * as JsonFormComponent from '@shared/components/json-form/json-form.component';
import * as ImageInputComponent from '@shared/components/image-input.component';
import * as FileInputComponent from '@shared/components/file-input.component';
import * as MessageTypeAutocompleteComponent from '@shared/components/message-type-autocomplete.component';
import * as KeyValMapComponent from '@shared/components/kv-map.component';
import * as NavTreeComponent from '@shared/components/nav-tree.component';
import * as LedLightComponent from '@shared/components/led-light.component';
import * as TbJsonToStringDirective from '@shared/components/directives/tb-json-to-string.directive';
import * as JsonObjectEditDialogComponent from '@shared/components/dialog/json-object-edit-dialog.component';
import * as HistorySelectorComponent from '@shared/components/time/history-selector/history-selector.component';
import * as EntityGatewaySelectComponent from '@shared/components/entity/entity-gateway-select.component';
import * as ContactComponent from '@shared/components/contact.component';
import * as OtaPackageAutocompleteComponent from '@shared/components/ota-package/ota-package-autocomplete.component';
import * as WidgetsBundleSearchComponent from '@shared/components/widgets-bundle-search.component';
import * as CopyButtonComponent from '@shared/components/button/copy-button.component';
import * as TogglePasswordComponent from '@shared/components/button/toggle-password.component';
import * as ProtobufContentComponent from '@shared/components/protobuf-content.component';
import * as AddEntityDialogComponent from '@home/components/entity/add-entity-dialog.component';
import * as EntitiesTableComponent from '@home/components/entity/entities-table.component';
import * as DetailsPanelComponent from '@home/components/details-panel.component';
import * as EntityDetailsPanelComponent from '@home/components/entity/entity-details-panel.component';
import * as AuditLogDetailsDialogComponent from '@home/components/audit-log/audit-log-details-dialog.component';
import * as AuditLogTableComponent from '@home/components/audit-log/audit-log-table.component';
import * as EventTableHeaderComponent from '@home/components/event/event-table-header.component';
import * as EventTableComponent from '@home/components/event/event-table.component';
import * as EventFilterPanelComponent from '@home/components/event/event-filter-panel.component';
import * as RelationTableComponent from '@home/components/relation/relation-table.component';
import * as RelationDialogComponent from '@home/components/relation/relation-dialog.component';
import * as AlarmTableHeaderComponent from '@home/components/alarm/alarm-table-header.component';
import * as AlarmTableComponent from '@home/components/alarm/alarm-table.component';
import * as AttributeTableComponent from '@home/components/attribute/attribute-table.component';
import * as AddAttributeDialogComponent from '@home/components/attribute/add-attribute-dialog.component';
import * as EditAttributeValuePanelComponent from '@home/components/attribute/edit-attribute-value-panel.component';
import * as DashboardComponent from '@home/components/dashboard/dashboard.component';
import * as WidgetComponent from '@home/components/widget/widget.component';
import * as LegendComponent from '@home/components/widget/legend.component';
import * as AliasesEntitySelectPanelComponent from '@home/components/alias/aliases-entity-select-panel.component';
import * as AliasesEntitySelectComponent from '@home/components/alias/aliases-entity-select.component';
import * as WidgetConfigComponent from '@home/components/widget/widget-config.component';
import * as EntityAliasesDialogComponent from '@home/components/alias/entity-aliases-dialog.component';
import * as EntityFilterViewComponent from '@home/components/entity/entity-filter-view.component';
import * as EntityAliasDialogComponent from '@home/components/alias/entity-alias-dialog.component';
import * as EntityFilterComponent from '@home/components/entity/entity-filter.component';
import * as RelationFiltersComponent from '@home/components/relation/relation-filters.component';
import * as EntityAliasSelectComponent from '@home/components/alias/entity-alias-select.component';
import * as DataKeysComponent from '@home/components/widget/data-keys.component';
import * as DataKeyConfigDialogComponent from '@home/components/widget/data-key-config-dialog.component';
import * as DataKeyConfigComponent from '@home/components/widget/data-key-config.component';
import * as LegendConfigComponent from '@home/components/widget/legend-config.component';
import * as ManageWidgetActionsComponent from '@home/components/widget/action/manage-widget-actions.component';
import * as WidgetActionDialogComponent from '@home/components/widget/action/widget-action-dialog.component';
import * as CustomActionPrettyResourcesTabsComponent from '@home/components/widget/action/custom-action-pretty-resources-tabs.component';
import * as CustomActionPrettyEditorComponent from '@home/components/widget/action/custom-action-pretty-editor.component';
import * as MobileActionEditorComponent from '@home/components/widget/action/mobile-action-editor.component';
import * as CustomDialogService from '@home/components/widget/dialog/custom-dialog.service';
import * as CustomDialogContainerComponent from '@home/components/widget/dialog/custom-dialog-container.component';
import * as ImportDialogComponent from '@home/components/import-export/import-dialog.component';
import * as AddWidgetToDashboardDialogComponent from '@home/components/attribute/add-widget-to-dashboard-dialog.component';
import * as ImportDialogCsvComponent from '@home/components/import-export/import-dialog-csv.component';
import * as TableColumnsAssignmentComponent from '@home/components/import-export/table-columns-assignment.component';
import * as EventContentDialogComponent from '@home/components/event/event-content-dialog.component';
import * as SharedHomeComponentsModule from '@home/components/shared-home-components.module';
import * as SelectTargetLayoutDialogComponent from '@home/components/dashboard/select-target-layout-dialog.component';
import * as SelectTargetStateDialogComponent from '@home/components/dashboard/select-target-state-dialog.component';
import * as AliasesEntityAutocompleteComponent from '@home/components/alias/aliases-entity-autocomplete.component';
import * as BooleanFilterPredicateComponent from '@home/components/filter/boolean-filter-predicate.component';
import * as StringFilterPredicateComponent from '@home/components/filter/string-filter-predicate.component';
import * as NumericFilterPredicateComponent from '@home/components/filter/numeric-filter-predicate.component';
import * as ComplexFilterPredicateComponent from '@home/components/filter/complex-filter-predicate.component';
import * as FilterPredicateComponent from '@home/components/filter/filter-predicate.component';
import * as FilterPredicateListComponent from '@home/components/filter/filter-predicate-list.component';
import * as KeyFilterListComponent from '@home/components/filter/key-filter-list.component';
import * as ComplexFilterPredicateDialogComponent from '@home/components/filter/complex-filter-predicate-dialog.component';
import * as KeyFilterDialogComponent from '@home/components/filter/key-filter-dialog.component';
import * as FiltersDialogComponent from '@home/components/filter/filters-dialog.component';
import * as FilterDialogComponent from '@home/components/filter/filter-dialog.component';
import * as FilterSelectComponent from '@home/components/filter/filter-select.component';
import * as FiltersEditComponent from '@home/components/filter/filters-edit.component';
import * as FiltersEditPanelComponent from '@home/components/filter/filters-edit-panel.component';
import * as UserFilterDialogComponent from '@home/components/filter/user-filter-dialog.component';
import * as FilterUserInfoComponent from '@home/components/filter/filter-user-info.component';
import * as FilterUserInfoDialogComponent from '@home/components/filter/filter-user-info-dialog.component';
import * as FilterPredicateValueComponent from '@home/components/filter/filter-predicate-value.component';
import * as TenantProfileComponent from '@home/components/profile/tenant-profile.component';
import * as TenantProfileDialogComponent from '@home/components/profile/tenant-profile-dialog.component';
import * as TenantProfileDataComponent from '@home/components/profile/tenant-profile-data.component';
// tslint:disable-next-line:max-line-length
import * as DefaultDeviceProfileConfigurationComponent from '@home/components/profile/device/default-device-profile-configuration.component';
import * as DeviceProfileConfigurationComponent from '@home/components/profile/device/device-profile-configuration.component';
import * as DeviceProfileComponent from '@home/components/profile/device-profile.component';
import * as DefaultDeviceProfileTransportConfigurationComponent from '@home/components/profile/device/default-device-profile-transport-configuration.component';
import * as DeviceProfileTransportConfigurationComponent from '@home/components/profile/device/device-profile-transport-configuration.component';
import * as DeviceProfileDialogComponent from '@home/components/profile/device-profile-dialog.component';
import * as DeviceProfileAutocompleteComponent from '@home/components/profile/device-profile-autocomplete.component';
import * as MqttDeviceProfileTransportConfigurationComponent from '@home/components/profile/device/mqtt-device-profile-transport-configuration.component';
import * as CoapDeviceProfileTransportConfigurationComponent from '@home/components/profile/device/coap-device-profile-transport-configuration.component';
import * as DeviceProfileAlarmsComponent from '@home/components/profile/alarm/device-profile-alarms.component';
import * as DeviceProfileAlarmComponent from '@home/components/profile/alarm/device-profile-alarm.component';
import * as CreateAlarmRulesComponent from '@home/components/profile/alarm/create-alarm-rules.component';
import * as AlarmRuleComponent from '@home/components/profile/alarm/alarm-rule.component';
import * as AlarmRuleConditionComponent from '@home/components/profile/alarm/alarm-rule-condition.component';
import * as FilterTextComponent from '@home/components/filter/filter-text.component';
import * as AddDeviceProfileDialogComponent from '@home/components/profile/add-device-profile-dialog.component';
import * as RuleChainAutocompleteComponent from '@home/components/rule-chain/rule-chain-autocomplete.component';
import * as DeviceProfileProvisionConfigurationComponent from '@home/components/profile/device-profile-provision-configuration.component';
import * as AlarmScheduleComponent from '@home/components/profile/alarm/alarm-schedule.component';
import * as DeviceWizardDialogComponent from '@home/components/wizard/device-wizard-dialog.component';
import * as AlarmScheduleInfoComponent from '@home/components/profile/alarm/alarm-schedule-info.component';
import * as AlarmScheduleDialogComponent from '@home/components/profile/alarm/alarm-schedule-dialog.component';
import * as EditAlarmDetailsDialogComponent from '@home/components/profile/alarm/edit-alarm-details-dialog.component';
import * as AlarmRuleConditionDialogComponent from '@home/components/profile/alarm/alarm-rule-condition-dialog.component';
// tslint:disable-next-line:max-line-length
import * as DefaultTenantProfileConfigurationComponent from '@home/components/profile/tenant/default-tenant-profile-configuration.component';
import * as TenantProfileConfigurationComponent from '@home/components/profile/tenant/tenant-profile-configuration.component';
import * as SmsProviderConfigurationComponent from '@home/components/sms/sms-provider-configuration.component';
import * as AwsSnsProviderConfigurationComponent from '@home/components/sms/aws-sns-provider-configuration.component';
import * as TwilioSmsProviderConfigurationComponent from '@home/components/sms/twilio-sms-provider-configuration.component';
import * as DashboardPageComponent from '@home/components/dashboard-page/dashboard-page.component';
import * as DashboardToolbarComponent from '@home/components/dashboard-page/dashboard-toolbar.component';
import * as DashboardLayoutComponent from '@home/components/dashboard-page/layout/dashboard-layout.component';
import * as EditWidgetComponent from '@home/components/dashboard-page/edit-widget.component';
import * as DashboardWidgetSelectComponent from '@home/components/dashboard-page/dashboard-widget-select.component';
import * as AddWidgetDialogComponent from '@home/components/dashboard-page/add-widget-dialog.component';
import * as ManageDashboardLayoutsDialogComponent from '@home/components/dashboard-page/layout/manage-dashboard-layouts-dialog.component';
import * as DashboardSettingsDialogComponent from '@home/components/dashboard-page/dashboard-settings-dialog.component';
import * as ManageDashboardStatesDialogComponent from '@home/components/dashboard-page/states/manage-dashboard-states-dialog.component';
import * as DashboardStateDialogComponent from '@home/components/dashboard-page/states/dashboard-state-dialog.component';
import * as EmbedDashboardDialogComponent from '@home/components/widget/dialog/embed-dashboard-dialog.component';
import * as EdgeDownlinkTableComponent from '@home/components/edge/edge-downlink-table.component';
import * as EdgeDownlinkTableHeaderComponent from '@home/components/edge/edge-downlink-table-header.component';
import * as DisplayWidgetTypesPanelComponent from '@home/components/dashboard-page/widget-types-panel.component';
import * as AlarmDurationPredicateValueComponent from '@home/components/profile/alarm/alarm-duration-predicate-value.component';
import * as DashboardImageDialogComponent from '@home/components/dashboard-page/dashboard-image-dialog.component';
import * as WidgetContainerComponent from '@home/components/widget/widget-container.component';
import { IModulesMap } from '@modules/common/modules-map.models';
declare const System;
class ModulesMap implements IModulesMap {
private initialized = false;
private modulesMap: {[key: string]: any} = {
'@angular/animations': AngularAnimations,
'@angular/core': AngularCore,
'@angular/common': AngularCommon,
'@angular/common/http': HttpClientModule,
'@angular/forms': AngularForms,
'@angular/flex-layout': AngularFlexLayout,
'@angular/flex-layout/flex': AngularFlexLayoutFlex,
'@angular/flex-layout/grid': AngularFlexLayoutGrid,
'@angular/flex-layout/extended': AngularFlexLayoutExtended,
'@angular/platform-browser': AngularPlatformBrowser,
'@angular/router': AngularRouter,
'@angular/cdk/coercion': AngularCdkCoercion,
'@angular/cdk/collections': AngularCdkCollections,
'@angular/cdk/keycodes': AngularCdkKeycodes,
'@angular/cdk/layout': AngularCdkLayout,
'@angular/cdk/overlay': AngularCdkOverlay,
'@angular/cdk/portal': AngularCdkPortal,
'@angular/cdk/drag-drop': DragDropModule,
'@angular/material/autocomplete': AngularMaterialAutocomplete,
'@angular/material/badge': AngularMaterialBadge,
'@angular/material/bottom-sheet': AngularMaterialBottomSheet,
'@angular/material/button': AngularMaterialButton,
'@angular/material/button-toggle': AngularMaterialButtonToggle,
'@angular/material/card': AngularMaterialCard,
'@angular/material/checkbox': AngularMaterialCheckbox,
'@angular/material/chips': AngularMaterialChips,
'@angular/material/core': AngularMaterialCore,
'@angular/material/datepicker': AngularMaterialDatepicker,
'@angular/material/dialog': AngularMaterialDialog,
'@angular/material/divider': AngularMaterialDivider,
'@angular/material/expansion': AngularMaterialExpansion,
'@angular/material/form-field': AngularMaterialFormField,
'@angular/material/grid-list': AngularMaterialGridList,
'@angular/material/icon': AngularMaterialIcon,
'@angular/material/input': AngularMaterialInput,
'@angular/material/list': AngularMaterialList,
'@angular/material/menu': AngularMaterialMenu,
'@angular/material/paginator': AngularMaterialPaginator,
'@angular/material/progress-bar': AngularMaterialProgressBar,
'@angular/material/progress-spinner': AngularMaterialProgressSpinner,
'@angular/material/radio': AngularMaterialRadio,
'@angular/material/select': AngularMaterialSelect,
'@angular/material/sidenav': AngularMaterialSidenav,
'@angular/material/slide-toggle': AngularMaterialSlideToggle,
'@angular/material/slider': AngularMaterialSlider,
'@angular/material/snack-bar': AngularMaterialSnackBar,
'@angular/material/sort': AngularMaterialSort,
'@angular/material/stepper': AngularMaterialStepper,
'@angular/material/table': AngularMaterialTable,
'@angular/material/tabs': AngularMaterialTabs,
'@angular/material/toolbar': AngularMaterialToolbar,
'@angular/material/tooltip': AngularMaterialTooltip,
'@angular/material/tree': AngularMaterialTree,
'@ngrx/store': NgrxStore,
rxjs: RxJs,
'rxjs/operators': RxJsOperators,
'@ngx-translate/core': TranslateCore,
moment: _moment,
'@core/public-api': TbCore,
'@shared/public-api': TbShared,
'@home/components/public-api': TbHomeComponents,
'@shared/pipe/milliseconds-to-time-string.pipe': MillisecondsToTimeStringPipe,
'@shared/pipe/enum-to-array.pipe': EnumToArrayPipe,
'@shared/pipe/highlight.pipe': HighlightPipe,
'@shared/pipe/truncate.pipe': TruncatePipe,
'@shared/pipe/tbJson.pipe': TbJsonPipe,
'@shared/pipe/file-size.pipe': FileSizePipe,
'@shared/pipe/nospace.pipe': NospacePipe,
'@shared/pipe/selectable-columns.pipe': SelectableColumnsPipe,
'@shared/pipe/keyboard-shortcut.pipe': KeyboardShortcutPipe,
'@shared/components/footer.component': FooterComponent,
'@shared/components/logo.component': LogoComponent,
'@shared/components/footer-fab-buttons.component': FooterFabButtonsComponent,
'@shared/components/fullscreen.directive': FullscreenDirective,
'@shared/components/circular-progress.directive': CircularProgressDirective,
'@shared/components/mat-chip-draggable.directive': MatChipDraggableDirective,
'@shared/components/hotkeys.directive': TbHotkeysDirective,
'@shared/components/tb-anchor.component': TbAnchorComponent,
'@shared/components/popover.component': TbPopoverComponent,
'@shared/components/directives/sring-template-outlet.directive': TbStringTemplateOutletDirective,
'@shared/components/directives/component-outlet.directive': TbComponentOutletDirective,
'@shared/components/markdown.component': TbMarkdownComponent,
'@shared/components/help.component': HelpComponent,
'@shared/components/help-markdown.component': HelpMarkdownComponent,
'@shared/components/help-popup.component': HelpPopupComponent,
'@shared/components/tb-checkbox.component': TbCheckboxComponent,
'@shared/components/toast.directive': TbToast,
'@shared/components/tb-error.component': TbErrorComponent,
'@shared/components/cheatsheet.component': TbCheatSheetComponent,
'@shared/components/breadcrumb.component': BreadcrumbComponent,
'@shared/components/user-menu.component': UserMenuComponent,
'@shared/components/time/timewindow.component': TimewindowComponent,
'@shared/components/time/timewindow-panel.component': TimewindowPanelComponent,
'@shared/components/time/timeinterval.component': TimeintervalComponent,
'@shared/components/time/quick-time-interval.component': QuickTimeIntervalComponent,
'@shared/components/dashboard-select.component': DashboardSelectComponent,
'@shared/components/dashboard-select-panel.component': DashboardSelectPanelComponent,
'@shared/components/time/datetime-period.component': DatetimePeriodComponent,
'@shared/components/time/datetime.component': DatetimeComponent,
'@shared/components/time/timezone-select.component': TimezoneSelectComponent,
'@shared/components/value-input.component': ValueInputComponent,
'@shared/components/dashboard-autocomplete.component': DashboardAutocompleteComponent,
'@shared/components/entity/entity-subtype-autocomplete.component': EntitySubTypeAutocompleteComponent,
'@shared/components/entity/entity-subtype-select.component': EntitySubTypeSelectComponent,
'@shared/components/entity/entity-subtype-list.component': EntitySubTypeListComponent,
'@shared/components/entity/entity-autocomplete.component': EntityAutocompleteComponent,
'@shared/components/entity/entity-list.component': EntityListComponent,
'@shared/components/entity/entity-type-select.component': EntityTypeSelectComponent,
'@shared/components/entity/entity-select.component': EntitySelectComponent,
'@shared/components/entity/entity-keys-list.component': EntityKeysListComponent,
'@shared/components/entity/entity-list-select.component': EntityListSelectComponent,
'@shared/components/entity/entity-type-list.component': EntityTypeListComponent,
'@shared/components/queue/queue-type-list.component': QueueTypeListComponent,
'@shared/components/relation/relation-type-autocomplete.component': RelationTypeAutocompleteComponent,
'@shared/components/socialshare-panel.component': SocialSharePanelComponent,
'@shared/components/json-object-edit.component': JsonObjectEditComponent,
'@shared/components/json-content.component': JsonContentComponent,
'@shared/components/js-func.component': JsFuncComponent,
'@shared/components/fab-toolbar.component': FabToolbarComponent,
'@shared/components/widgets-bundle-select.component': WidgetsBundleSelectComponent,
'@shared/components/dialog/confirm-dialog.component': ConfirmDialogComponent,
'@shared/components/dialog/alert-dialog.component': AlertDialogComponent,
'@shared/components/dialog/todo-dialog.component': TodoDialogComponent,
'@shared/components/dialog/color-picker-dialog.component': ColorPickerDialogComponent,
'@shared/components/dialog/material-icons-dialog.component': MaterialIconsDialogComponent,
'@shared/components/color-input.component': ColorInputComponent,
'@shared/components/material-icon-select.component': MaterialIconSelectComponent,
'@shared/components/dialog/node-script-test-dialog.component': NodeScriptTestDialogComponent,
'@shared/components/json-form/json-form.component': JsonFormComponent,
'@shared/components/image-input.component': ImageInputComponent,
'@shared/components/file-input.component': FileInputComponent,
'@shared/components/message-type-autocomplete.component': MessageTypeAutocompleteComponent,
'@shared/components/kv-map.component': KeyValMapComponent,
'@shared/components/nav-tree.component': NavTreeComponent,
'@shared/components/led-light.component': LedLightComponent,
'@shared/components/directives/tb-json-to-string.directive': TbJsonToStringDirective,
'@shared/components/dialog/json-object-edit-dialog.component': JsonObjectEditDialogComponent,
'@shared/components/time/history-selector/history-selector.component': HistorySelectorComponent,
'@shared/components/entity/entity-gateway-select.component': EntityGatewaySelectComponent,
'@shared/components/contact.component': ContactComponent,
'@shared/components/ota-package/ota-package-autocomplete.component': OtaPackageAutocompleteComponent,
'@shared/components/widgets-bundle-search.component': WidgetsBundleSearchComponent,
'@shared/components/button/copy-button.component': CopyButtonComponent,
'@shared/components/button/toggle-password.component': TogglePasswordComponent,
'@shared/components/protobuf-content.component': ProtobufContentComponent,
'@home/components/entity/add-entity-dialog.component': AddEntityDialogComponent,
'@home/components/entity/entities-table.component': EntitiesTableComponent,
'@home/components/details-panel.component': DetailsPanelComponent,
'@home/components/entity/entity-details-panel.component': EntityDetailsPanelComponent,
'@home/components/audit-log/audit-log-details-dialog.component': AuditLogDetailsDialogComponent,
'@home/components/audit-log/audit-log-table.component': AuditLogTableComponent,
'@home/components/event/event-table-header.component': EventTableHeaderComponent,
'@home/components/event/event-table.component': EventTableComponent,
'@home/components/event/event-filter-panel.component': EventFilterPanelComponent,
'@home/components/relation/relation-table.component': RelationTableComponent,
'@home/components/relation/relation-dialog.component': RelationDialogComponent,
'@home/components/alarm/alarm-table-header.component': AlarmTableHeaderComponent,
'@home/components/alarm/alarm-table.component': AlarmTableComponent,
'@home/components/attribute/attribute-table.component': AttributeTableComponent,
'@home/components/attribute/add-attribute-dialog.component': AddAttributeDialogComponent,
'@home/components/attribute/edit-attribute-value-panel.component': EditAttributeValuePanelComponent,
'@home/components/dashboard/dashboard.component': DashboardComponent,
'@home/components/widget/widget.component': WidgetComponent,
'@home/components/widget/legend.component': LegendComponent,
'@home/components/alias/aliases-entity-select-panel.component': AliasesEntitySelectPanelComponent,
'@home/components/alias/aliases-entity-select.component': AliasesEntitySelectComponent,
'@home/components/widget/widget-config.component': WidgetConfigComponent,
'@home/components/alias/entity-aliases-dialog.component': EntityAliasesDialogComponent,
'@home/components/entity/entity-filter-view.component': EntityFilterViewComponent,
'@home/components/alias/entity-alias-dialog.component': EntityAliasDialogComponent,
'@home/components/entity/entity-filter.component': EntityFilterComponent,
'@home/components/relation/relation-filters.component': RelationFiltersComponent,
'@home/components/alias/entity-alias-select.component': EntityAliasSelectComponent,
'@home/components/widget/data-keys.component': DataKeysComponent,
'@home/components/widget/data-key-config-dialog.component': DataKeyConfigDialogComponent,
'@home/components/widget/data-key-config.component': DataKeyConfigComponent,
'@home/components/widget/legend-config.component': LegendConfigComponent,
'@home/components/widget/action/manage-widget-actions.component': ManageWidgetActionsComponent,
'@home/components/widget/action/widget-action-dialog.component': WidgetActionDialogComponent,
'@home/components/widget/action/custom-action-pretty-resources-tabs.component': CustomActionPrettyResourcesTabsComponent,
'@home/components/widget/action/custom-action-pretty-editor.component': CustomActionPrettyEditorComponent,
'@home/components/widget/action/mobile-action-editor.component': MobileActionEditorComponent,
'@home/components/widget/dialog/custom-dialog.service': CustomDialogService,
'@home/components/widget/dialog/custom-dialog-container.component': CustomDialogContainerComponent,
'@home/components/import-export/import-dialog.component': ImportDialogComponent,
'@home/components/attribute/add-widget-to-dashboard-dialog.component': AddWidgetToDashboardDialogComponent,
'@home/components/import-export/import-dialog-csv.component': ImportDialogCsvComponent,
'@home/components/import-export/table-columns-assignment.component': TableColumnsAssignmentComponent,
'@home/components/event/event-content-dialog.component': EventContentDialogComponent,
'@home/components/shared-home-components.module': SharedHomeComponentsModule,
'@home/components/dashboard/select-target-layout-dialog.component': SelectTargetLayoutDialogComponent,
'@home/components/dashboard/select-target-state-dialog.component': SelectTargetStateDialogComponent,
'@home/components/alias/aliases-entity-autocomplete.component': AliasesEntityAutocompleteComponent,
'@home/components/filter/boolean-filter-predicate.component': BooleanFilterPredicateComponent,
'@home/components/filter/string-filter-predicate.component': StringFilterPredicateComponent,
'@home/components/filter/numeric-filter-predicate.component': NumericFilterPredicateComponent,
'@home/components/filter/complex-filter-predicate.component': ComplexFilterPredicateComponent,
'@home/components/filter/filter-predicate.component': FilterPredicateComponent,
'@home/components/filter/filter-predicate-list.component': FilterPredicateListComponent,
'@home/components/filter/key-filter-list.component': KeyFilterListComponent,
'@home/components/filter/complex-filter-predicate-dialog.component': ComplexFilterPredicateDialogComponent,
'@home/components/filter/key-filter-dialog.component': KeyFilterDialogComponent,
'@home/components/filter/filters-dialog.component': FiltersDialogComponent,
'@home/components/filter/filter-dialog.component': FilterDialogComponent,
'@home/components/filter/filter-select.component': FilterSelectComponent,
'@home/components/filter/filters-edit.component': FiltersEditComponent,
'@home/components/filter/filters-edit-panel.component': FiltersEditPanelComponent,
'@home/components/filter/user-filter-dialog.component': UserFilterDialogComponent,
'@home/components/filter/filter-user-info.component': FilterUserInfoComponent,
'@home/components/filter/filter-user-info-dialog.component': FilterUserInfoDialogComponent,
'@home/components/filter/filter-predicate-value.component': FilterPredicateValueComponent,
'@home/components/profile/tenant-profile.component': TenantProfileComponent,
'@home/components/profile/tenant-profile-dialog.component': TenantProfileDialogComponent,
'@home/components/profile/tenant-profile-data.component': TenantProfileDataComponent,
'@home/components/profile/device/default-device-profile-configuration.component': DefaultDeviceProfileConfigurationComponent,
'@home/components/profile/device/device-profile-configuration.component': DeviceProfileConfigurationComponent,
'@home/components/profile/device-profile.component': DeviceProfileComponent,
'@home/components/profile/device/default-device-profile-transport-configuration.component':
DefaultDeviceProfileTransportConfigurationComponent,
'@home/components/profile/device/device-profile-transport-configuration.component': DeviceProfileTransportConfigurationComponent,
'@home/components/profile/device-profile-dialog.component': DeviceProfileDialogComponent,
'@home/components/profile/device-profile-autocomplete.component': DeviceProfileAutocompleteComponent,
'@home/components/profile/device/mqtt-device-profile-transport-configuration.component':
MqttDeviceProfileTransportConfigurationComponent,
'@home/components/profile/device/coap-device-profile-transport-configuration.component':
CoapDeviceProfileTransportConfigurationComponent,
'@home/components/profile/alarm/device-profile-alarms.component': DeviceProfileAlarmsComponent,
'@home/components/profile/alarm/device-profile-alarm.component': DeviceProfileAlarmComponent,
'@home/components/profile/alarm/create-alarm-rules.component': CreateAlarmRulesComponent,
'@home/components/profile/alarm/alarm-rule.component': AlarmRuleComponent,
'@home/components/profile/alarm/alarm-rule-condition.component': AlarmRuleConditionComponent,
'@home/components/filter/filter-text.component': FilterTextComponent,
'@home/components/profile/add-device-profile-dialog.component': AddDeviceProfileDialogComponent,
'@home/components/rule-chain/rule-chain-autocomplete.component': RuleChainAutocompleteComponent,
'@home/components/profile/device-profile-provision-configuration.component': DeviceProfileProvisionConfigurationComponent,
'@home/components/profile/alarm/alarm-schedule.component': AlarmScheduleComponent,
'@home/components/wizard/device-wizard-dialog.component': DeviceWizardDialogComponent,
'@home/components/profile/alarm/alarm-schedule-info.component': AlarmScheduleInfoComponent,
'@home/components/profile/alarm/alarm-schedule-dialog.component': AlarmScheduleDialogComponent,
'@home/components/profile/alarm/edit-alarm-details-dialog.component': EditAlarmDetailsDialogComponent,
'@home/components/profile/alarm/alarm-rule-condition-dialog.component': AlarmRuleConditionDialogComponent,
'@home/components/profile/tenant/default-tenant-profile-configuration.component': DefaultTenantProfileConfigurationComponent,
'@home/components/profile/tenant/tenant-profile-configuration.component': TenantProfileConfigurationComponent,
'@home/components/sms/sms-provider-configuration.component': SmsProviderConfigurationComponent,
'@home/components/sms/aws-sns-provider-configuration.component': AwsSnsProviderConfigurationComponent,
'@home/components/sms/twilio-sms-provider-configuration.component': TwilioSmsProviderConfigurationComponent,
'@home/components/dashboard-page/dashboard-page.component': DashboardPageComponent,
'@home/components/dashboard-page/dashboard-toolbar.component': DashboardToolbarComponent,
'@home/components/dashboard-page/layout/dashboard-layout.component': DashboardLayoutComponent,
'@home/components/dashboard-page/edit-widget.component': EditWidgetComponent,
'@home/components/dashboard-page/dashboard-widget-select.component': DashboardWidgetSelectComponent,
'@home/components/dashboard-page/add-widget-dialog.component': AddWidgetDialogComponent,
'@home/components/dashboard-page/layout/manage-dashboard-layouts-dialog.component': ManageDashboardLayoutsDialogComponent,
'@home/components/dashboard-page/dashboard-settings-dialog.component': DashboardSettingsDialogComponent,
'@home/components/dashboard-page/states/manage-dashboard-states-dialog.component': ManageDashboardStatesDialogComponent,
'@home/components/dashboard-page/states/dashboard-state-dialog.component': DashboardStateDialogComponent,
'@home/components/widget/dialog/embed-dashboard-dialog.component': EmbedDashboardDialogComponent,
'@home/components/edge/edge-downlink-table.component': EdgeDownlinkTableComponent,
'@home/components/edge/edge-downlink-table-header.component': EdgeDownlinkTableHeaderComponent,
'@home/components/dashboard-page/widget-types-panel.component': DisplayWidgetTypesPanelComponent,
'@home/components/profile/alarm/alarm-duration-predicate-value.component': AlarmDurationPredicateValueComponent,
'@home/components/dashboard-page/dashboard-image-dialog.component': DashboardImageDialogComponent,
'@home/components/widget/widget-container.component': WidgetContainerComponent,
};
init() {
if (!this.initialized) {
System.constructor.prototype.resolve = (id) => {
try {
if (this.modulesMap[id]) {
return 'app:' + id;
} else {
return id;
}
} catch (err) {
return id;
}
};
for (const moduleId of Object.keys(this.modulesMap)) {
System.set('app:' + moduleId, this.modulesMap[moduleId]);
}
this.initialized = true;
}
}
}
export const modulesMap = new ModulesMap();

6
ui-ngx/src/app/modules/home/components/dashboard-page/states/states-controller.module.ts

@ -17,9 +17,9 @@
import { NgModule } from '@angular/core'; import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common'; import { CommonModule } from '@angular/common';
import { SharedModule } from '@shared/shared.module'; import { SharedModule } from '@shared/shared.module';
import { StatesControllerService } from './states-controller.service'; import { StatesControllerService } from '@home/components/dashboard-page/states/states-controller.service';
import { EntityStateControllerComponent } from './entity-state-controller.component'; import { EntityStateControllerComponent } from '@home/components/dashboard-page/states/entity-state-controller.component';
import { StatesComponentDirective } from './states-component.directive'; import { StatesComponentDirective } from '@home/components/dashboard-page/states/states-component.directive';
import { HomeDialogsModule } from '@app/modules/home/dialogs/home-dialogs.module'; import { HomeDialogsModule } from '@app/modules/home/dialogs/home-dialogs.module';
import { DefaultStateControllerComponent } from '@home/components/dashboard-page/states/default-state-controller.component'; import { DefaultStateControllerComponent } from '@home/components/dashboard-page/states/default-state-controller.component';

10
ui-ngx/src/app/modules/home/components/device/device-credentials.module.ts

@ -17,11 +17,11 @@
import { NgModule } from '@angular/core'; import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common'; import { CommonModule } from '@angular/common';
import { SharedModule } from '@shared/shared.module'; import { SharedModule } from '@shared/shared.module';
import { CopyDeviceCredentialsComponent } from './copy-device-credentials.component'; import { CopyDeviceCredentialsComponent } from '@home/components/device/copy-device-credentials.component';
import { DeviceCredentialsComponent } from './device-credentials.component'; import { DeviceCredentialsComponent } from '@home/components/device/device-credentials.component';
import { DeviceCredentialsLwm2mComponent } from './device-credentials-lwm2m.component'; import { DeviceCredentialsLwm2mComponent } from '@home/components/device/device-credentials-lwm2m.component';
import { DeviceCredentialsLwm2mServerComponent } from './device-credentials-lwm2m-server.component'; import { DeviceCredentialsLwm2mServerComponent } from '@home/components/device/device-credentials-lwm2m-server.component';
import { DeviceCredentialsMqttBasicComponent } from './device-credentials-mqtt-basic.component'; import { DeviceCredentialsMqttBasicComponent } from '@home/components/device/device-credentials-mqtt-basic.component';
@NgModule({ @NgModule({
declarations: [ declarations: [

3
ui-ngx/src/app/modules/home/components/entity/entities-table.component.ts

@ -64,6 +64,7 @@ import { DomSanitizer, SafeHtml } from '@angular/platform-browser';
import { TbAnchorComponent } from '@shared/components/tb-anchor.component'; import { TbAnchorComponent } from '@shared/components/tb-anchor.component';
import { isDefined, isUndefined } from '@core/utils'; import { isDefined, isUndefined } from '@core/utils';
import { HasUUID } from '@shared/models/id/has-uuid'; import { HasUUID } from '@shared/models/id/has-uuid';
import { IEntitiesTableComponent } from '@home/models/entity/entity-table-component.models';
@Component({ @Component({
selector: 'tb-entities-table', selector: 'tb-entities-table',
@ -71,7 +72,7 @@ import { HasUUID } from '@shared/models/id/has-uuid';
styleUrls: ['./entities-table.component.scss'], styleUrls: ['./entities-table.component.scss'],
changeDetection: ChangeDetectionStrategy.OnPush changeDetection: ChangeDetectionStrategy.OnPush
}) })
export class EntitiesTableComponent extends PageComponent implements AfterViewInit, OnInit, OnChanges { export class EntitiesTableComponent extends PageComponent implements IEntitiesTableComponent, AfterViewInit, OnInit, OnChanges {
@Input() @Input()
entitiesTableConfig: EntityTableConfig<BaseData<HasId>>; entitiesTableConfig: EntityTableConfig<BaseData<HasId>>;

20
ui-ngx/src/app/modules/home/components/filter/complex-filter-predicate-dialog.component.ts

@ -23,22 +23,12 @@ import { FormBuilder, FormControl, FormGroup, FormGroupDirective, NgForm, Valida
import { Router } from '@angular/router'; import { Router } from '@angular/router';
import { DialogComponent } from '@app/shared/components/dialog.component'; import { DialogComponent } from '@app/shared/components/dialog.component';
import { import {
BooleanOperation, booleanOperationTranslationMap, ComplexFilterPredicateInfo,
ComplexFilterPredicate, ComplexFilterPredicateInfo, ComplexOperation, complexOperationTranslationMap, ComplexOperation,
EntityKeyValueType, complexOperationTranslationMap,
FilterPredicateType, KeyFilterPredicateInfo FilterPredicateType
} from '@shared/models/query/query.models'; } from '@shared/models/query/query.models';
import { ComplexFilterPredicateDialogData } from '@home/components/filter/filter-component.models';
export interface ComplexFilterPredicateDialogData {
complexPredicate: ComplexFilterPredicateInfo;
key: string;
readonly: boolean;
isAdd: boolean;
valueType: EntityKeyValueType;
displayUserParameters: boolean;
allowUserDynamicSource: boolean;
onlyUserDynamicSource: boolean;
}
@Component({ @Component({
selector: 'tb-complex-filter-predicate-dialog', selector: 'tb-complex-filter-predicate-dialog',

16
ui-ngx/src/app/modules/home/components/filter/complex-filter-predicate.component.ts

@ -14,15 +14,14 @@
/// limitations under the License. /// limitations under the License.
/// ///
import { Component, forwardRef, Input, OnInit } from '@angular/core'; import { Component, forwardRef, Inject, Input, OnInit } from '@angular/core';
import { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms'; import { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms';
import { ComplexFilterPredicateInfo, EntityKeyValueType } from '@shared/models/query/query.models'; import { ComplexFilterPredicateInfo, EntityKeyValueType } from '@shared/models/query/query.models';
import { MatDialog } from '@angular/material/dialog'; import { MatDialog } from '@angular/material/dialog';
import {
ComplexFilterPredicateDialogComponent,
ComplexFilterPredicateDialogData
} from '@home/components/filter/complex-filter-predicate-dialog.component';
import { deepClone } from '@core/utils'; import { deepClone } from '@core/utils';
import { ComplexFilterPredicateDialogData } from '@home/components/filter/filter-component.models';
import { COMPLEX_FILTER_PREDICATE_DIALOG_COMPONENT_TOKEN } from '@home/components/tokens';
import { ComponentType } from '@angular/cdk/portal';
@Component({ @Component({
selector: 'tb-complex-filter-predicate', selector: 'tb-complex-filter-predicate',
@ -54,7 +53,8 @@ export class ComplexFilterPredicateComponent implements ControlValueAccessor, On
private complexFilterPredicate: ComplexFilterPredicateInfo; private complexFilterPredicate: ComplexFilterPredicateInfo;
constructor(private dialog: MatDialog) { constructor(@Inject(COMPLEX_FILTER_PREDICATE_DIALOG_COMPONENT_TOKEN) private complexFilterPredicateDialogComponent: ComponentType<any>,
private dialog: MatDialog) {
} }
ngOnInit(): void { ngOnInit(): void {
@ -76,8 +76,8 @@ export class ComplexFilterPredicateComponent implements ControlValueAccessor, On
} }
public openComplexFilterDialog() { public openComplexFilterDialog() {
this.dialog.open<ComplexFilterPredicateDialogComponent, ComplexFilterPredicateDialogData, this.dialog.open<any, ComplexFilterPredicateDialogData,
ComplexFilterPredicateInfo>(ComplexFilterPredicateDialogComponent, { ComplexFilterPredicateInfo>(this.complexFilterPredicateDialogComponent, {
disableClose: true, disableClose: true,
panelClass: ['tb-dialog', 'tb-fullscreen-dialog'], panelClass: ['tb-dialog', 'tb-fullscreen-dialog'],
data: { data: {

29
ui-ngx/src/app/modules/home/components/filter/filter-component.models.ts

@ -0,0 +1,29 @@
///
/// Copyright © 2016-2021 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 { ComplexFilterPredicateInfo, EntityKeyValueType } from '@shared/models/query/query.models';
export interface ComplexFilterPredicateDialogData {
complexPredicate: ComplexFilterPredicateInfo;
key: string;
readonly: boolean;
isAdd: boolean;
valueType: EntityKeyValueType;
displayUserParameters: boolean;
allowUserDynamicSource: boolean;
onlyUserDynamicSource: boolean;
}

14
ui-ngx/src/app/modules/home/components/filter/filter-predicate-list.component.ts

@ -14,7 +14,7 @@
/// limitations under the License. /// limitations under the License.
/// ///
import { Component, forwardRef, Input, OnInit } from '@angular/core'; import { Component, forwardRef, Inject, Input, OnInit } from '@angular/core';
import { import {
AbstractControl, AbstractControl,
ControlValueAccessor, ControlValueAccessor,
@ -36,12 +36,11 @@ import {
EntityKeyValueType, EntityKeyValueType,
KeyFilterPredicateInfo KeyFilterPredicateInfo
} from '@shared/models/query/query.models'; } from '@shared/models/query/query.models';
import {
ComplexFilterPredicateDialogComponent,
ComplexFilterPredicateDialogData
} from '@home/components/filter/complex-filter-predicate-dialog.component';
import { MatDialog } from '@angular/material/dialog'; import { MatDialog } from '@angular/material/dialog';
import { map } from 'rxjs/operators'; import { map } from 'rxjs/operators';
import { ComponentType } from '@angular/cdk/portal';
import { COMPLEX_FILTER_PREDICATE_DIALOG_COMPONENT_TOKEN } from '@home/components/tokens';
import { ComplexFilterPredicateDialogData } from '@home/components/filter/filter-component.models';
@Component({ @Component({
selector: 'tb-filter-predicate-list', selector: 'tb-filter-predicate-list',
@ -87,6 +86,7 @@ export class FilterPredicateListComponent implements ControlValueAccessor, Valid
private valueChangeSubscription: Subscription = null; private valueChangeSubscription: Subscription = null;
constructor(private fb: FormBuilder, constructor(private fb: FormBuilder,
@Inject(COMPLEX_FILTER_PREDICATE_DIALOG_COMPONENT_TOKEN) private complexFilterPredicateDialogComponent: ComponentType<any>,
private dialog: MatDialog) { private dialog: MatDialog) {
} }
@ -164,8 +164,8 @@ export class FilterPredicateListComponent implements ControlValueAccessor, Valid
} }
private openComplexFilterDialog(predicate: KeyFilterPredicateInfo): Observable<KeyFilterPredicateInfo> { private openComplexFilterDialog(predicate: KeyFilterPredicateInfo): Observable<KeyFilterPredicateInfo> {
return this.dialog.open<ComplexFilterPredicateDialogComponent, ComplexFilterPredicateDialogData, return this.dialog.open<any, ComplexFilterPredicateDialogData,
ComplexFilterPredicateInfo>(ComplexFilterPredicateDialogComponent, { ComplexFilterPredicateInfo>(this.complexFilterPredicateDialogComponent, {
disableClose: true, disableClose: true,
panelClass: ['tb-dialog', 'tb-fullscreen-dialog'], panelClass: ['tb-dialog', 'tb-fullscreen-dialog'],
data: { data: {

8
ui-ngx/src/app/modules/home/components/home-components.module.ts

@ -141,6 +141,10 @@ import { WidgetContainerComponent } from '@home/components/widget/widget-contain
import { SnmpDeviceProfileTransportModule } from '@home/components/profile/device/snpm/snmp-device-profile-transport.module'; import { SnmpDeviceProfileTransportModule } from '@home/components/profile/device/snpm/snmp-device-profile-transport.module';
import { DeviceCredentialsModule } from '@home/components/device/device-credentials.module'; import { DeviceCredentialsModule } from '@home/components/device/device-credentials.module';
import { DeviceProfileCommonModule } from '@home/components/profile/device/common/device-profile-common.module'; import { DeviceProfileCommonModule } from '@home/components/profile/device/common/device-profile-common.module';
import {
COMPLEX_FILTER_PREDICATE_DIALOG_COMPONENT_TOKEN,
DASHBOARD_PAGE_COMPONENT_TOKEN
} from '@home/components/tokens';
@NgModule({ @NgModule({
declarations: declarations:
@ -375,7 +379,9 @@ import { DeviceProfileCommonModule } from '@home/components/profile/device/commo
WidgetComponentService, WidgetComponentService,
CustomDialogService, CustomDialogService,
ImportExportService, ImportExportService,
{provide: EMBED_DASHBOARD_DIALOG_TOKEN, useValue: EmbedDashboardDialogComponent} {provide: EMBED_DASHBOARD_DIALOG_TOKEN, useValue: EmbedDashboardDialogComponent},
{provide: COMPLEX_FILTER_PREDICATE_DIALOG_COMPONENT_TOKEN, useValue: ComplexFilterPredicateDialogComponent},
{provide: DASHBOARD_PAGE_COMPONENT_TOKEN, useValue: DashboardPageComponent}
] ]
}) })
export class HomeComponentsModule { } export class HomeComponentsModule { }

4
ui-ngx/src/app/modules/home/components/profile/device/common/device-profile-common.module.ts

@ -15,10 +15,10 @@
/// ///
import { NgModule } from '@angular/core'; import { NgModule } from '@angular/core';
import { PowerModeSettingComponent } from './power-mode-setting.component'; import { PowerModeSettingComponent } from '@home/components/profile/device/common/power-mode-setting.component';
import { SharedModule } from '@shared/shared.module'; import { SharedModule } from '@shared/shared.module';
import { CommonModule } from '@angular/common'; import { CommonModule } from '@angular/common';
import { TimeUnitSelectComponent } from './time-unit-select.component'; import { TimeUnitSelectComponent } from '@home/components/profile/device/common/time-unit-select.component';
@NgModule({ @NgModule({
declarations: [ declarations: [

22
ui-ngx/src/app/modules/home/components/profile/device/lwm2m/lwm2m-profile-components.module.ts

@ -15,19 +15,19 @@
/// ///
import { NgModule } from '@angular/core'; import { NgModule } from '@angular/core';
import { Lwm2mDeviceProfileTransportConfigurationComponent } from './lwm2m-device-profile-transport-configuration.component'; import { Lwm2mDeviceProfileTransportConfigurationComponent } from '@home/components/profile/device/lwm2m/lwm2m-device-profile-transport-configuration.component';
import { Lwm2mObjectListComponent } from './lwm2m-object-list.component'; import { Lwm2mObjectListComponent } from '@home/components/profile/device/lwm2m/lwm2m-object-list.component';
import { Lwm2mObserveAttrTelemetryComponent } from './lwm2m-observe-attr-telemetry.component'; import { Lwm2mObserveAttrTelemetryComponent } from '@home/components/profile/device/lwm2m/lwm2m-observe-attr-telemetry.component';
import { Lwm2mObserveAttrTelemetryResourcesComponent } from './lwm2m-observe-attr-telemetry-resources.component'; import { Lwm2mObserveAttrTelemetryResourcesComponent } from '@home/components/profile/device/lwm2m/lwm2m-observe-attr-telemetry-resources.component';
import { Lwm2mAttributesDialogComponent } from './lwm2m-attributes-dialog.component'; import { Lwm2mAttributesDialogComponent } from '@home/components/profile/device/lwm2m/lwm2m-attributes-dialog.component';
import { Lwm2mAttributesComponent } from './lwm2m-attributes.component'; import { Lwm2mAttributesComponent } from '@home/components/profile/device/lwm2m/lwm2m-attributes.component';
import { Lwm2mAttributesKeyListComponent } from './lwm2m-attributes-key-list.component'; import { Lwm2mAttributesKeyListComponent } from '@home/components/profile/device/lwm2m/lwm2m-attributes-key-list.component';
import { Lwm2mDeviceConfigServerComponent } from './lwm2m-device-config-server.component'; import { Lwm2mDeviceConfigServerComponent } from '@home/components/profile/device/lwm2m/lwm2m-device-config-server.component';
import { Lwm2mObjectAddInstancesDialogComponent } from './lwm2m-object-add-instances-dialog.component'; import { Lwm2mObjectAddInstancesDialogComponent } from '@home/components/profile/device/lwm2m/lwm2m-object-add-instances-dialog.component';
import { Lwm2mObjectAddInstancesListComponent } from './lwm2m-object-add-instances-list.component'; import { Lwm2mObjectAddInstancesListComponent } from '@home/components/profile/device/lwm2m/lwm2m-object-add-instances-list.component';
import { CommonModule } from '@angular/common'; import { CommonModule } from '@angular/common';
import { SharedModule } from '@app/shared/shared.module'; import { SharedModule } from '@app/shared/shared.module';
import { Lwm2mObserveAttrTelemetryInstancesComponent } from './lwm2m-observe-attr-telemetry-instances.component'; import { Lwm2mObserveAttrTelemetryInstancesComponent } from '@home/components/profile/device/lwm2m/lwm2m-observe-attr-telemetry-instances.component';
import { DeviceProfileCommonModule } from '@home/components/profile/device/common/device-profile-common.module'; import { DeviceProfileCommonModule } from '@home/components/profile/device/common/device-profile-common.module';
@NgModule({ @NgModule({

4
ui-ngx/src/app/modules/home/components/profile/device/snpm/snmp-device-profile-transport.module.ts

@ -18,8 +18,8 @@ import { NgModule } from '@angular/core';
import { SharedModule } from '@shared/shared.module'; import { SharedModule } from '@shared/shared.module';
import { CommonModule } from '@angular/common'; import { CommonModule } from '@angular/common';
import { SnmpDeviceProfileTransportConfigurationComponent } from '@home/components/profile/device/snpm/snmp-device-profile-transport-configuration.component'; import { SnmpDeviceProfileTransportConfigurationComponent } from '@home/components/profile/device/snpm/snmp-device-profile-transport-configuration.component';
import { SnmpDeviceProfileCommunicationConfigComponent } from './snmp-device-profile-communication-config.component'; import { SnmpDeviceProfileCommunicationConfigComponent } from '@home/components/profile/device/snpm/snmp-device-profile-communication-config.component';
import { SnmpDeviceProfileMappingComponent } from './snmp-device-profile-mapping.component'; import { SnmpDeviceProfileMappingComponent } from '@home/components/profile/device/snpm/snmp-device-profile-mapping.component';
@NgModule({ @NgModule({
declarations: [ declarations: [

4
ui-ngx/src/app/modules/home/components/shared-home-components.module.ts

@ -18,8 +18,12 @@ import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common'; import { CommonModule } from '@angular/common';
import { SharedModule } from '@app/shared/shared.module'; import { SharedModule } from '@app/shared/shared.module';
import { AlarmDetailsDialogComponent } from '@home/components/alarm/alarm-details-dialog.component'; import { AlarmDetailsDialogComponent } from '@home/components/alarm/alarm-details-dialog.component';
import { SHARED_HOME_COMPONENTS_MODULE_TOKEN } from '@home/components/tokens';
@NgModule({ @NgModule({
providers: [
{ provide: SHARED_HOME_COMPONENTS_MODULE_TOKEN, useValue: SharedHomeComponentsModule }
],
declarations: declarations:
[ [
AlarmDetailsDialogComponent AlarmDetailsDialogComponent

27
ui-ngx/src/app/modules/home/components/tokens.ts

@ -0,0 +1,27 @@
///
/// Copyright © 2016-2021 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 { InjectionToken, Type } from '@angular/core';
import { ComponentType } from '@angular/cdk/portal';
export const SHARED_HOME_COMPONENTS_MODULE_TOKEN: InjectionToken<Type<any>> =
new InjectionToken<Type<any>>('SHARED_HOME_COMPONENTS_MODULE_TOKEN');
export const COMPLEX_FILTER_PREDICATE_DIALOG_COMPONENT_TOKEN: InjectionToken<ComponentType<any>> =
new InjectionToken<ComponentType<any>>('COMPLEX_FILTER_PREDICATE_DIALOG_COMPONENT_TOKEN');
export const DASHBOARD_PAGE_COMPONENT_TOKEN: InjectionToken<ComponentType<any>> =
new InjectionToken<ComponentType<any>>('DASHBOARD_PAGE_COMPONENT_TOKEN');

22
ui-ngx/src/app/modules/home/components/widget/dialog/custom-dialog.service.ts

@ -14,21 +14,21 @@
/// limitations under the License. /// limitations under the License.
/// ///
import { Injectable, NgModule } from '@angular/core'; import { Inject, Injectable, Type } from '@angular/core';
import { Observable } from 'rxjs'; import { Observable } from 'rxjs';
import { MatDialog } from '@angular/material/dialog'; import { MatDialog } from '@angular/material/dialog';
import { TranslateService } from '@ngx-translate/core'; import { TranslateService } from '@ngx-translate/core';
import { AuthService } from '@core/auth/auth.service'; import { AuthService } from '@core/auth/auth.service';
import { DynamicComponentFactoryService } from '@core/services/dynamic-component-factory.service'; import { DynamicComponentFactoryService } from '@core/services/dynamic-component-factory.service';
import { CommonModule } from '@angular/common'; import { CommonModule } from '@angular/common';
import { SharedModule } from '@shared/shared.module';
import { mergeMap, tap } from 'rxjs/operators'; import { mergeMap, tap } from 'rxjs/operators';
import { CustomDialogComponent } from './custom-dialog.component'; import { CustomDialogComponent } from './custom-dialog.component';
import { import {
CustomDialogContainerComponent, CustomDialogContainerComponent,
CustomDialogContainerData CustomDialogContainerData
} from '@home/components/widget/dialog/custom-dialog-container.component'; } from '@home/components/widget/dialog/custom-dialog-container.component';
import { SharedHomeComponentsModule } from '@home/components/shared-home-components.module'; import { SHARED_MODULE_TOKEN } from '@shared/components/tokens';
import { SHARED_HOME_COMPONENTS_MODULE_TOKEN } from '@home/components/tokens';
@Injectable() @Injectable()
export class CustomDialogService { export class CustomDialogService {
@ -37,6 +37,8 @@ export class CustomDialogService {
private translate: TranslateService, private translate: TranslateService,
private authService: AuthService, private authService: AuthService,
private dynamicComponentFactoryService: DynamicComponentFactoryService, private dynamicComponentFactoryService: DynamicComponentFactoryService,
@Inject(SHARED_MODULE_TOKEN) private sharedModule: Type<any>,
@Inject(SHARED_HOME_COMPONENTS_MODULE_TOKEN) private sharedHomeComponentsModule: Type<any>,
public dialog: MatDialog public dialog: MatDialog
) { ) {
} }
@ -45,7 +47,7 @@ export class CustomDialogService {
return this.dynamicComponentFactoryService.createDynamicComponentFactory( return this.dynamicComponentFactoryService.createDynamicComponentFactory(
class CustomDialogComponentInstance extends CustomDialogComponent {}, class CustomDialogComponentInstance extends CustomDialogComponent {},
template, template,
[SharedModule, CustomDialogModule, SharedHomeComponentsModule]).pipe( [this.sharedModule, CommonModule, this.sharedHomeComponentsModule]).pipe(
mergeMap((factory) => { mergeMap((factory) => {
const dialogData: CustomDialogContainerData = { const dialogData: CustomDialogContainerData = {
controller, controller,
@ -69,15 +71,3 @@ export class CustomDialogService {
} }
@NgModule({
declarations:
[
],
imports: [
CommonModule,
SharedModule
],
exports: [
]
})
class CustomDialogModule { }

1
ui-ngx/src/app/modules/home/components/widget/lib/maps/leaflet-map.ts

@ -168,6 +168,7 @@ export default abstract class LeafletMap {
this.selectedEntity = data; this.selectedEntity = data;
this.toggleDrawMode(type); this.toggleDrawMode(type);
} else { } else {
// @ts-ignore
this.map.pm.Toolbar.toggleButton(type, false); this.map.pm.Toolbar.toggleButton(type, false);
} }
}); });

1
ui-ngx/src/app/modules/home/components/widget/lib/rpc/led-indicator.component.scss

@ -13,7 +13,6 @@
* See the License for the specific language governing permissions and * See the License for the specific language governing permissions and
* limitations under the License. * limitations under the License.
*/ */
@import "node_modules/compass-sass-mixins/lib/compass";
$error-height: 14px !default; $error-height: 14px !default;

1
ui-ngx/src/app/modules/home/components/widget/lib/rpc/round-switch.component.scss

@ -13,7 +13,6 @@
* See the License for the specific language governing permissions and * See the License for the specific language governing permissions and
* limitations under the License. * limitations under the License.
*/ */
@import "node_modules/compass-sass-mixins/lib/compass";
$error-height: 14px !default; $error-height: 14px !default;

3
ui-ngx/src/app/modules/home/components/widget/widget-component.service.ts

@ -44,6 +44,7 @@ import { SharedModule } from '@shared/shared.module';
import { MODULES_MAP } from '@shared/public-api'; import { MODULES_MAP } from '@shared/public-api';
import * as tinycolor_ from 'tinycolor2'; import * as tinycolor_ from 'tinycolor2';
import moment from 'moment'; import moment from 'moment';
import { IModulesMap } from '@modules/common/modules-map.models';
const tinycolor = tinycolor_; const tinycolor = tinycolor_;
@ -64,7 +65,7 @@ export class WidgetComponentService {
private editingWidgetType: WidgetType; private editingWidgetType: WidgetType;
constructor(@Inject(WINDOW) private window: Window, constructor(@Inject(WINDOW) private window: Window,
@Optional() @Inject(MODULES_MAP) private modulesMap: {[key: string]: any}, @Optional() @Inject(MODULES_MAP) private modulesMap: IModulesMap,
private dynamicComponentFactoryService: DynamicComponentFactoryService, private dynamicComponentFactoryService: DynamicComponentFactoryService,
private widgetService: WidgetService, private widgetService: WidgetService,
private utils: UtilsService, private utils: UtilsService,

10
ui-ngx/src/app/modules/home/components/widget/widget-components.module.ts

@ -30,10 +30,10 @@ import {
DateRangeNavigatorPanelComponent, DateRangeNavigatorPanelComponent,
DateRangeNavigatorWidgetComponent DateRangeNavigatorWidgetComponent
} from '@home/components/widget/lib/date-range-navigator/date-range-navigator.component'; } from '@home/components/widget/lib/date-range-navigator/date-range-navigator.component';
import { MultipleInputWidgetComponent } from './lib/multiple-input-widget.component'; import { MultipleInputWidgetComponent } from '@home/components/widget/lib/multiple-input-widget.component';
import { TripAnimationComponent } from './trip-animation/trip-animation.component'; import { TripAnimationComponent } from '@home/components/widget/trip-animation/trip-animation.component';
import { PhotoCameraInputWidgetComponent } from './lib/photo-camera-input.component'; import { PhotoCameraInputWidgetComponent } from '@home/components/widget/lib/photo-camera-input.component';
import { GatewayFormComponent } from './lib/gateway/gateway-form.component'; import { GatewayFormComponent } from '@home/components/widget/lib/gateway/gateway-form.component';
import { ImportExportService } from '@home/components/import-export/import-export.service'; import { ImportExportService } from '@home/components/import-export/import-export.service';
import { NavigationCardsWidgetComponent } from '@home/components/widget/lib/navigation-cards-widget.component'; import { NavigationCardsWidgetComponent } from '@home/components/widget/lib/navigation-cards-widget.component';
import { NavigationCardWidgetComponent } from '@home/components/widget/lib/navigation-card-widget.component'; import { NavigationCardWidgetComponent } from '@home/components/widget/lib/navigation-card-widget.component';
@ -41,7 +41,7 @@ import { EdgesOverviewWidgetComponent } from '@home/components/widget/lib/edges-
import { JsonInputWidgetComponent } from '@home/components/widget/lib/json-input-widget.component'; import { JsonInputWidgetComponent } from '@home/components/widget/lib/json-input-widget.component';
import { QrCodeWidgetComponent } from '@home/components/widget/lib/qrcode-widget.component'; import { QrCodeWidgetComponent } from '@home/components/widget/lib/qrcode-widget.component';
import { MarkdownWidgetComponent } from '@home/components/widget/lib/markdown-widget.component'; import { MarkdownWidgetComponent } from '@home/components/widget/lib/markdown-widget.component';
import { SelectEntityDialogComponent } from './lib/maps/dialogs/select-entity-dialog.component'; import { SelectEntityDialogComponent } from '@home/components/widget/lib/maps/dialogs/select-entity-dialog.component';
@NgModule({ @NgModule({
declarations: declarations:

7
ui-ngx/src/app/modules/home/components/widget/widget.component.ts

@ -107,9 +107,11 @@ import { ComponentType } from '@angular/cdk/portal';
import { EMBED_DASHBOARD_DIALOG_TOKEN } from '@home/components/widget/dialog/embed-dashboard-dialog-token'; import { EMBED_DASHBOARD_DIALOG_TOKEN } from '@home/components/widget/dialog/embed-dashboard-dialog-token';
import { MobileService } from '@core/services/mobile.service'; import { MobileService } from '@core/services/mobile.service';
import { DialogService } from '@core/services/dialog.service'; import { DialogService } from '@core/services/dialog.service';
import { DashboardPageComponent } from '@home/components/dashboard-page/dashboard-page.component';
import { PopoverPlacement } from '@shared/components/popover.models'; import { PopoverPlacement } from '@shared/components/popover.models';
import { TbPopoverService } from '@shared/components/popover.service'; import { TbPopoverService } from '@shared/components/popover.service';
import {
DASHBOARD_PAGE_COMPONENT_TOKEN
} from '@home/components/tokens';
@Component({ @Component({
selector: 'tb-widget', selector: 'tb-widget',
@ -183,6 +185,7 @@ export class WidgetComponent extends PageComponent implements OnInit, AfterViewI
private renderer: Renderer2, private renderer: Renderer2,
private popoverService: TbPopoverService, private popoverService: TbPopoverService,
@Inject(EMBED_DASHBOARD_DIALOG_TOKEN) private embedDashboardDialogComponent: ComponentType<any>, @Inject(EMBED_DASHBOARD_DIALOG_TOKEN) private embedDashboardDialogComponent: ComponentType<any>,
@Inject(DASHBOARD_PAGE_COMPONENT_TOKEN) private dashboardPageComponent: ComponentType<any>,
private widgetService: WidgetService, private widgetService: WidgetService,
private resources: ResourcesService, private resources: ResourcesService,
private timeService: TimeService, private timeService: TimeService,
@ -1354,7 +1357,7 @@ export class WidgetComponent extends PageComponent implements OnInit, AfterViewI
] ]
}); });
const component = this.popoverService.displayPopover(trigger, this.renderer, const component = this.popoverService.displayPopover(trigger, this.renderer,
this.widgetContentContainer, DashboardPageComponent, preferredPlacement, hideOnClickOutside, this.widgetContentContainer, this.dashboardPageComponent, preferredPlacement, hideOnClickOutside,
injector, injector,
{ {
embed: true, embed: true,

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

@ -25,14 +25,12 @@ import { PageComponent } from '@shared/components/page.component';
import { AppState } from '@core/core.state'; import { AppState } from '@core/core.state';
import { getCurrentAuthState, selectAuthUser, selectUserDetails } from '@core/auth/auth.selectors'; import { getCurrentAuthState, selectAuthUser, selectUserDetails } from '@core/auth/auth.selectors';
import { MediaBreakpoints } from '@shared/models/constants'; import { MediaBreakpoints } from '@shared/models/constants';
import * as _screenfull from 'screenfull'; import screenfull from 'screenfull';
import { MatSidenav } from '@angular/material/sidenav'; import { MatSidenav } from '@angular/material/sidenav';
import { AuthState } from '@core/auth/auth.models'; import { AuthState } from '@core/auth/auth.models';
import { WINDOW } from '@core/services/window.service'; import { WINDOW } from '@core/services/window.service';
import { instanceOfSearchableComponent, ISearchableComponent } from '@home/models/searchable-component.models'; import { instanceOfSearchableComponent, ISearchableComponent } from '@home/models/searchable-component.models';
const screenfull = _screenfull as _screenfull.Screenfull;
@Component({ @Component({
selector: 'tb-home', selector: 'tb-home',
templateUrl: './home.component.html', templateUrl: './home.component.html',

4
ui-ngx/src/app/modules/home/models/entity/entities-table-config.models.ts

@ -26,11 +26,11 @@ import { Type } from '@angular/core';
import { EntityAction } from './entity-component.models'; import { EntityAction } from './entity-component.models';
import { HasUUID } from '@shared/models/id/has-uuid'; import { HasUUID } from '@shared/models/id/has-uuid';
import { PageLink } from '@shared/models/page/page-link'; import { PageLink } from '@shared/models/page/page-link';
import { EntitiesTableComponent } from '@home/components/entity/entities-table.component';
import { EntityTableHeaderComponent } from '@home/components/entity/entity-table-header.component'; import { EntityTableHeaderComponent } from '@home/components/entity/entity-table-header.component';
import { ActivatedRoute } from '@angular/router'; import { ActivatedRoute } from '@angular/router';
import { EntityTabsComponent } from '../../components/entity/entity-tabs.component'; import { EntityTabsComponent } from '../../components/entity/entity-tabs.component';
import { DAY, historyInterval } from '@shared/models/time/time.models'; import { DAY, historyInterval } from '@shared/models/time/time.models';
import { IEntitiesTableComponent } from '@home/models/entity/entity-table-component.models';
export type EntityBooleanFunction<T extends BaseData<HasId>> = (entity: T) => boolean; export type EntityBooleanFunction<T extends BaseData<HasId>> = (entity: T) => boolean;
export type EntityStringFunction<T extends BaseData<HasId>> = (entity: T) => string; export type EntityStringFunction<T extends BaseData<HasId>> = (entity: T) => string;
@ -140,7 +140,7 @@ export class EntityTableConfig<T extends BaseData<HasId>, P extends PageLink = P
loadDataOnInit = true; loadDataOnInit = true;
onLoadAction: (route: ActivatedRoute) => void = null; onLoadAction: (route: ActivatedRoute) => void = null;
table: EntitiesTableComponent = null; table: IEntitiesTableComponent = null;
useTimePageLink = false; useTimePageLink = false;
defaultTimewindowInterval = historyInterval(DAY); defaultTimewindowInterval = historyInterval(DAY);
entityType: EntityType = null; entityType: EntityType = null;

85
ui-ngx/src/app/modules/home/models/entity/entity-table-component.models.ts

@ -0,0 +1,85 @@
///
/// Copyright © 2016-2021 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 { BaseData, HasId } from '@shared/models/base-data';
import { EntityTypeTranslation } from '@shared/models/entity-type.models';
import { SafeHtml } from '@angular/platform-browser';
import { PageLink } from '@shared/models/page/page-link';
import { Timewindow } from '@shared/models/time/time.models';
import { EntitiesDataSource } from '@home/models/datasource/entity-datasource';
import { ElementRef, EventEmitter } from '@angular/core';
import { TbAnchorComponent } from '@shared/components/tb-anchor.component';
import { MatPaginator } from '@angular/material/paginator';
import { MatSort } from '@angular/material/sort';
import { EntityAction } from '@home/models/entity/entity-component.models';
import {
CellActionDescriptor, EntityActionTableColumn, EntityColumn, EntityTableColumn,
EntityTableConfig,
GroupActionDescriptor,
HeaderActionDescriptor
} from '@home/models/entity/entities-table-config.models';
export interface IEntitiesTableComponent {
entitiesTableConfig: EntityTableConfig<BaseData<HasId>>;
translations: EntityTypeTranslation;
headerActionDescriptors: Array<HeaderActionDescriptor>;
groupActionDescriptors: Array<GroupActionDescriptor<BaseData<HasId>>>;
cellActionDescriptors: Array<CellActionDescriptor<BaseData<HasId>>>;
actionColumns: Array<EntityActionTableColumn<BaseData<HasId>>>;
entityColumns: Array<EntityTableColumn<BaseData<HasId>>>;
displayedColumns: string[];
headerCellStyleCache: Array<any>;
cellContentCache: Array<SafeHtml>;
cellTooltipCache: Array<string>;
cellStyleCache: Array<any>;
selectionEnabled: boolean;
defaultPageSize: number;
displayPagination: boolean;
pageSizeOptions: number[];
pageLink: PageLink;
textSearchMode: boolean;
timewindow: Timewindow;
dataSource: EntitiesDataSource<BaseData<HasId>>;
isDetailsOpen: boolean;
detailsPanelOpened: EventEmitter<boolean>;
entityTableHeaderAnchor: TbAnchorComponent;
searchInputField: ElementRef;
paginator: MatPaginator;
sort: MatSort;
addEnabled(): boolean;
clearSelection(): void;
updateData(closeDetails?: boolean): void;
onRowClick($event: Event, entity): void;
toggleEntityDetails($event: Event, entity);
addEntity($event: Event): void;
onEntityUpdated(entity: BaseData<HasId>): void;
onEntityAction(action: EntityAction<BaseData<HasId>>): void;
deleteEntity($event: Event, entity: BaseData<HasId>): void;
deleteEntities($event: Event, entities: BaseData<HasId>[]): void;
onTimewindowChange(): void;
enterFilterMode(): void;
exitFilterMode(): void;
resetSortAndFilter(update?: boolean, preserveTimewindow?: boolean): void;
columnsUpdated(resetData?: boolean): void;
headerCellStyle(column: EntityColumn<BaseData<HasId>>): any;
clearCellCache(col: number, row: number): void;
cellContent(entity: BaseData<HasId>, column: EntityColumn<BaseData<HasId>>, row: number): any;
cellTooltip(entity: BaseData<HasId>, column: EntityColumn<BaseData<HasId>>, row: number): string;
cellStyle(entity: BaseData<HasId>, column: EntityColumn<BaseData<HasId>>, row: number): any;
trackByColumnKey(index, column: EntityTableColumn<BaseData<HasId>>): string;
trackByEntityId(index: number, entity: BaseData<HasId>): string;
}

3
ui-ngx/src/app/modules/home/pages/rulechain/rulechain-routing.module.ts

@ -41,6 +41,7 @@ import { RuleNodeComponentDescriptor } from '@shared/models/rule-node.models';
import { ConfirmOnExitGuard } from '@core/guards/confirm-on-exit.guard'; import { ConfirmOnExitGuard } from '@core/guards/confirm-on-exit.guard';
import { ItemBufferService } from '@core/public-api'; import { ItemBufferService } from '@core/public-api';
import { MODULES_MAP } from '@shared/public-api'; import { MODULES_MAP } from '@shared/public-api';
import { IModulesMap } from '@modules/common/modules-map.models';
@Injectable() @Injectable()
export class RuleChainResolver implements Resolve<RuleChain> { export class RuleChainResolver implements Resolve<RuleChain> {
@ -70,7 +71,7 @@ export class ResolvedRuleChainMetaDataResolver implements Resolve<ResolvedRuleCh
export class RuleNodeComponentsResolver implements Resolve<Array<RuleNodeComponentDescriptor>> { export class RuleNodeComponentsResolver implements Resolve<Array<RuleNodeComponentDescriptor>> {
constructor(private ruleChainService: RuleChainService, constructor(private ruleChainService: RuleChainService,
@Optional() @Inject(MODULES_MAP) private modulesMap: {[key: string]: any}) { @Optional() @Inject(MODULES_MAP) private modulesMap: IModulesMap) {
} }
resolve(route: ActivatedRouteSnapshot): Observable<Array<RuleNodeComponentDescriptor>> { resolve(route: ActivatedRouteSnapshot): Observable<Array<RuleNodeComponentDescriptor>> {

2
ui-ngx/src/app/shared/components/cheatsheet.component.ts

@ -16,6 +16,8 @@
import { Component, ElementRef, Input, OnDestroy, OnInit } from '@angular/core'; import { Component, ElementRef, Input, OnDestroy, OnInit } from '@angular/core';
import { Hotkey, HotkeysService } from 'angular2-hotkeys'; import { Hotkey, HotkeysService } from 'angular2-hotkeys';
import { MousetrapInstance } from 'mousetrap';
import * as Mousetrap from 'mousetrap';
@Component({ @Component({
selector : 'tb-hotkeys-cheatsheet', selector : 'tb-hotkeys-cheatsheet',

13
ui-ngx/src/app/shared/components/fab-toolbar.component.scss

@ -13,6 +13,9 @@
* See the License for the specific language governing permissions and * See the License for the specific language governing permissions and
* limitations under the License. * limitations under the License.
*/ */
@use "sass:math";
$font-size: 10px !default; $font-size: 10px !default;
@function rem($multiplier) { @function rem($multiplier) {
@return $multiplier * $font-size; @return $multiplier * $font-size;
@ -47,10 +50,10 @@ $swift-ease-in: all $swift-ease-in-duration $swift-ease-in-timing-function !defa
} }
@mixin fab-all-positions() { @mixin fab-all-positions() {
@include fab-position(bottom-right, auto, ($button-fab-width - $button-fab-padding)/2, ($button-fab-height - $button-fab-padding)/2, auto); @include fab-position(bottom-right, auto, math.div(($button-fab-width - $button-fab-padding), 2), math.div(($button-fab-height - $button-fab-padding), 2), auto);
@include fab-position(bottom-left, auto, auto, ($button-fab-height - $button-fab-padding)/2, ($button-fab-width - $button-fab-padding)/2); @include fab-position(bottom-left, auto, auto, math.div(($button-fab-height - $button-fab-padding), 2), math.div(($button-fab-width - $button-fab-padding), 2));
@include fab-position(top-right, ($button-fab-height - $button-fab-padding)/2, ($button-fab-width - $button-fab-padding)/2, auto, auto); @include fab-position(top-right, math.div(($button-fab-height - $button-fab-padding), 2), math.div(($button-fab-width - $button-fab-padding), 2), auto, auto);
@include fab-position(top-left, ($button-fab-height - $button-fab-padding)/2, auto, auto, ($button-fab-width - $button-fab-padding)/2); @include fab-position(top-left, math.div(($button-fab-height - $button-fab-padding), 2), auto, auto, math.div(($button-fab-width - $button-fab-padding), 2));
} }
mat-fab-toolbar { mat-fab-toolbar {
@ -175,7 +178,7 @@ mat-fab-toolbar {
mat-toolbar { mat-toolbar {
.mat-fab-action-item { .mat-fab-action-item {
transition: $swift-ease-in; transition: $swift-ease-in;
transition-duration: $swift-ease-in-duration / 2; transition-duration: math.div($swift-ease-in-duration, 2);
} }
} }
&.mat-is-open { &.mat-is-open {

3
ui-ngx/src/app/shared/components/hotkeys.directive.ts

@ -16,7 +16,8 @@
import { Directive, ElementRef, Input, OnDestroy, OnInit } from '@angular/core'; import { Directive, ElementRef, Input, OnDestroy, OnInit } from '@angular/core';
import { Hotkey } from 'angular2-hotkeys'; import { Hotkey } from 'angular2-hotkeys';
import 'mousetrap'; import { MousetrapInstance } from 'mousetrap';
import * as Mousetrap from 'mousetrap';
import { TbCheatSheetComponent } from '@shared/components/cheatsheet.component'; import { TbCheatSheetComponent } from '@shared/components/cheatsheet.component';
@Directive({ @Directive({

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

@ -14,12 +14,12 @@
* limitations under the License. * limitations under the License.
*/ */
import * as React from 'react'; import * as React from 'react';
import { createMuiTheme, ThemeProvider } from '@material-ui/core/styles'; import { createTheme, ThemeProvider } from '@material-ui/core/styles';
import thingsboardTheme from './styles/thingsboardTheme'; import thingsboardTheme from './styles/thingsboardTheme';
import ThingsboardSchemaForm from './json-form-schema-form'; import ThingsboardSchemaForm from './json-form-schema-form';
import { JsonFormProps } from './json-form.models'; import { JsonFormProps } from './json-form.models';
const tbTheme = createMuiTheme(thingsboardTheme); const tbTheme = createTheme(thingsboardTheme);
class ReactSchemaForm extends React.Component<JsonFormProps, {}> { class ReactSchemaForm extends React.Component<JsonFormProps, {}> {

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

@ -13,7 +13,6 @@
* See the License for the specific language governing permissions and * See the License for the specific language governing permissions and
* limitations under the License. * limitations under the License.
*/ */
@import "~compass-sass-mixins/lib/compass";
$swift-ease-out-duration: .4s !default; $swift-ease-out-duration: .4s !default;
$swift-ease-out-timing-function: cubic-bezier(.25, .8, .25, 1) !default; $swift-ease-out-timing-function: cubic-bezier(.25, .8, .25, 1) !default;

2
ui-ngx/src/app/shared/components/json-form/react/styles/thingsboardTheme.ts

@ -31,7 +31,7 @@
*/ */
import indigo from '@material-ui/core/colors/indigo'; import indigo from '@material-ui/core/colors/indigo';
import deeepOrange from '@material-ui/core/colors/deepOrange'; import deeepOrange from '@material-ui/core/colors/deepOrange';
import { ThemeOptions } from '@material-ui/core/styles/createMuiTheme'; import { ThemeOptions } from '@material-ui/core/styles';
import { PaletteOptions } from '@material-ui/core/styles/createPalette'; import { PaletteOptions } from '@material-ui/core/styles/createPalette';
import { mergeDeep } from '@core/utils'; import { mergeDeep } from '@core/utils';

10
ui-ngx/src/app/shared/components/nav-tree.component.ts

@ -76,19 +76,19 @@ export class NavTreeComponent implements OnInit {
} }
@Input() @Input()
private loadNodes: LoadNodesCallback; loadNodes: LoadNodesCallback;
@Input() @Input()
private searchCallback: NodeSearchCallback; searchCallback: NodeSearchCallback;
@Input() @Input()
private onNodeSelected: NodeSelectedCallback; onNodeSelected: NodeSelectedCallback;
@Input() @Input()
private onNodesInserted: NodesInsertedCallback; onNodesInserted: NodesInsertedCallback;
@Input() @Input()
private editCallbacks: NavTreeEditCallbacks; editCallbacks: NavTreeEditCallbacks;
private treeElement: JSTree; private treeElement: JSTree;

2
ui-ngx/src/app/shared/components/popover.component.scss

@ -124,7 +124,7 @@ $box-shadow-base: 0 3px 6px -4px rgba(0, 0, 0, 0.12), 0 6px 16px 0 rgba(0, 0, 0,
height: sqrt($popover-arrow-width * $popover-arrow-width * 2) + px; height: sqrt($popover-arrow-width * $popover-arrow-width * 2) + px;
background: transparent; background: transparent;
border-style: solid; border-style: solid;
border-width: (sqrt($popover-arrow-width * $popover-arrow-width * 2) / 2) + px; border-width: (sqrt($popover-arrow-width * $popover-arrow-width * 2) * 0.5) + px;
transform: rotate(45deg); transform: rotate(45deg);
z-index: 10; z-index: 10;
} }

2
ui-ngx/src/app/shared/components/tokens.ts

@ -21,4 +21,4 @@ export const HELP_MARKDOWN_COMPONENT_TOKEN: InjectionToken<ComponentType<any>> =
new InjectionToken<ComponentType<any>>('HELP_MARKDOWN_COMPONENT_TOKEN'); new InjectionToken<ComponentType<any>>('HELP_MARKDOWN_COMPONENT_TOKEN');
export const SHARED_MODULE_TOKEN: InjectionToken<Type<any>> = export const SHARED_MODULE_TOKEN: InjectionToken<Type<any>> =
new InjectionToken<Type<any>>('HELP_MARKDOWN_COMPONENT_TOKEN'); new InjectionToken<Type<any>>('SHARED_MODULE_TOKEN');

3
ui-ngx/src/app/shared/models/constants.ts

@ -15,6 +15,7 @@
/// ///
import { InjectionToken } from '@angular/core'; import { InjectionToken } from '@angular/core';
import { IModulesMap } from '@modules/common/modules-map.models';
export const Constants = { export const Constants = {
serverErrorCode: { serverErrorCode: {
@ -244,4 +245,4 @@ export const contentTypesMap = new Map<ContentType, ContentTypeData>(
export const customTranslationsPrefix = 'custom.'; export const customTranslationsPrefix = 'custom.';
export const i18nPrefix = 'i18n'; export const i18nPrefix = 'i18n';
export const MODULES_MAP = new InjectionToken<{[key: string]: any}>('ModulesMap'); export const MODULES_MAP = new InjectionToken<IModulesMap>('ModulesMap');

4
ui-ngx/src/app/shared/shared.module.ts

@ -132,7 +132,7 @@ import { NavTreeComponent } from '@shared/components/nav-tree.component';
import { LedLightComponent } from '@shared/components/led-light.component'; import { LedLightComponent } from '@shared/components/led-light.component';
import { TbJsonToStringDirective } from '@shared/components/directives/tb-json-to-string.directive'; import { TbJsonToStringDirective } from '@shared/components/directives/tb-json-to-string.directive';
import { JsonObjectEditDialogComponent } from '@shared/components/dialog/json-object-edit-dialog.component'; import { JsonObjectEditDialogComponent } from '@shared/components/dialog/json-object-edit-dialog.component';
import { HistorySelectorComponent } from './components/time/history-selector/history-selector.component'; import { HistorySelectorComponent } from '@shared/components/time/history-selector/history-selector.component';
import { EntityGatewaySelectComponent } from '@shared/components/entity/entity-gateway-select.component'; import { EntityGatewaySelectComponent } from '@shared/components/entity/entity-gateway-select.component';
import { DndModule } from 'ngx-drag-drop'; import { DndModule } from 'ngx-drag-drop';
import { QueueTypeListComponent } from '@shared/components/queue/queue-type-list.component'; import { QueueTypeListComponent } from '@shared/components/queue/queue-type-list.component';
@ -155,7 +155,7 @@ import { MarkedOptionsService } from '@shared/components/marked-options.service'
import { TbPopoverService } from '@shared/components/popover.service'; import { TbPopoverService } from '@shared/components/popover.service';
import { HELP_MARKDOWN_COMPONENT_TOKEN, SHARED_MODULE_TOKEN } from '@shared/components/tokens'; import { HELP_MARKDOWN_COMPONENT_TOKEN, SHARED_MODULE_TOKEN } from '@shared/components/tokens';
import { TbMarkdownComponent } from '@shared/components/markdown.component'; import { TbMarkdownComponent } from '@shared/components/markdown.component';
import { ProtobufContentComponent } from './components/protobuf-content.component'; import { ProtobufContentComponent } from '@shared/components/protobuf-content.component';
export function MarkedOptionsFactory(markedOptionsService: MarkedOptionsService) { export function MarkedOptionsFactory(markedOptionsService: MarkedOptionsService) {
return markedOptionsService; return markedOptionsService;

1
ui-ngx/src/scss/animations.scss

@ -13,7 +13,6 @@
* See the License for the specific language governing permissions and * See the License for the specific language governing permissions and
* limitations under the License. * limitations under the License.
*/ */
@import "~compass-sass-mixins/lib/animate";
@keyframes tbMoveFromTopFade { @keyframes tbMoveFromTopFade {
from { from {

4
ui-ngx/src/scss/mixins.scss

@ -13,6 +13,8 @@
* See the License for the specific language governing permissions and * See the License for the specific language governing permissions and
* limitations under the License. * limitations under the License.
*/ */
@use "sass:math";
@mixin tb-mat-icon-size($size) { @mixin tb-mat-icon-size($size) {
width: #{$size}px; width: #{$size}px;
min-width: #{$size}px; min-width: #{$size}px;
@ -51,7 +53,7 @@
$x1: $x0; $x1: $x0;
@for $i from 1 through 10 { @for $i from 1 through 10 {
$x1: $x0 - ($x0 * $x0 - abs($r)) / (2 * $x0); $x1: $x0 - math.div($x0 * $x0 - abs($r), 2 * $x0);
$x0: $x1; $x0: $x1;
} }

9
ui-ngx/src/theme.scss

@ -158,17 +158,20 @@ $tb-dark-theme: get-tb-dark-theme(
} }
&.mat-primary { &.mat-primary {
.mat-fab-toolbar-background { .mat-fab-toolbar-background {
@include _mat-toolbar-color($primary); background: mat.get-color-from-palette($primary);
color: mat.get-color-from-palette($primary, default-contrast);
} }
} }
&.mat-accent { &.mat-accent {
.mat-fab-toolbar-background { .mat-fab-toolbar-background {
@include _mat-toolbar-color($accent); background: mat.get-color-from-palette($accent);
color: mat.get-color-from-palette($accent, default-contrast);
} }
} }
&.mat-warn { &.mat-warn {
.mat-fab-toolbar-background { .mat-fab-toolbar-background {
@include _mat-toolbar-color($warn); background: mat.get-color-from-palette($warn);
color: mat.get-color-from-palette($warn, default-contrast);
} }
} }
} }

2
ui-ngx/src/tsconfig.app.json

@ -3,7 +3,7 @@
"compilerOptions": { "compilerOptions": {
"outDir": "../out-tsc/app", "outDir": "../out-tsc/app",
"types": ["node", "jquery", "flot", "tooltipster", "tinycolor2", "js-beautify", "types": ["node", "jquery", "flot", "tooltipster", "tinycolor2", "js-beautify",
"react", "react-dom", "jstree", "raphael", "canvas-gauges"] "react", "react-dom", "jstree", "raphael", "canvas-gauges", "systemjs"]
}, },
"angularCompilerOptions": { "angularCompilerOptions": {
"fullTemplateTypeCheck": true "fullTemplateTypeCheck": true

20
ui-ngx/tsconfig.json

@ -3,15 +3,18 @@
"compilerOptions": { "compilerOptions": {
"baseUrl": "./", "baseUrl": "./",
"outDir": "./dist/out-tsc", "outDir": "./dist/out-tsc",
"forceConsistentCasingInFileNames": true,
"noFallthroughCasesInSwitch": true,
"sourceMap": true, "sourceMap": true,
"declaration": false, "declaration": false,
"module": "es2020", "downlevelIteration": true,
"experimentalDecorators": true,
"moduleResolution": "node", "moduleResolution": "node",
"importHelpers": true,
"target": "es2017",
"module": "es2020",
"emitDecoratorMetadata": true, "emitDecoratorMetadata": true,
"experimentalDecorators": true,
"allowSyntheticDefaultImports": true, "allowSyntheticDefaultImports": true,
"importHelpers": true,
"target": "es5",
"jsx": "react", "jsx": "react",
"typeRoots": [ "typeRoots": [
"node_modules/@types", "node_modules/@types",
@ -52,9 +55,14 @@
] ]
}, },
"lib": [ "lib": [
"es2018", "es2020",
"es2019",
"dom" "dom"
] ]
},
"angularCompilerOptions": {
"enableI18nLegacyMessageIdFormat": false,
"strictInjectionParameters": true,
"strictInputAccessModifiers": true,
"strictTemplates": false
} }
} }

5614
ui-ngx/yarn.lock

File diff suppressed because it is too large
Loading…
Cancel
Save