diff --git a/ui-ngx/extra-webpack.config.js b/ui-ngx/extra-webpack.config.js index 64a7c0768c..ef2e115252 100644 --- a/ui-ngx/extra-webpack.config.js +++ b/ui-ngx/extra-webpack.config.js @@ -17,7 +17,7 @@ const CompressionPlugin = require("compression-webpack-plugin"); const TerserPlugin = require("terser-webpack-plugin"); const webpack = require("webpack"); const dirTree = require("directory-tree"); -const AngularCompilerPlugin = require('@ngtools/webpack'); +const ngWebpack = require('@ngtools/webpack'); var langs = []; @@ -56,12 +56,12 @@ module.exports = (config, options) => { ); if (config.mode === 'production') { - const index = config.plugins.findIndex(p => p instanceof AngularCompilerPlugin.AngularCompilerPlugin); - const angularCompilerOptions = config.plugins[index]._options; + const index = config.plugins.findIndex(p => p instanceof ngWebpack.ivy.AngularWebpackPlugin); + const angularCompilerOptions = config.plugins[index].pluginOptions; angularCompilerOptions.emitClassMetadata = true; angularCompilerOptions.emitNgModuleScope = true; config.plugins.splice(index, 1); - config.plugins.push(new AngularCompilerPlugin.AngularCompilerPlugin(angularCompilerOptions)); + config.plugins.push(new ngWebpack.ivy.AngularWebpackPlugin(angularCompilerOptions)); const terserPluginOptions = config.optimization.minimizer[1].options; delete terserPluginOptions.terserOptions.compress.global_defs.ngJitMode; terserPluginOptions.terserOptions.compress.side_effects = false; diff --git a/ui-ngx/src/app/modules/home/components/widget/dialog/custom-dialog.component.ts b/ui-ngx/src/app/modules/home/components/widget/dialog/custom-dialog.component.ts index 0c3bee961f..0f518ab9ab 100644 --- a/ui-ngx/src/app/modules/home/components/widget/dialog/custom-dialog.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/dialog/custom-dialog.component.ts @@ -15,13 +15,14 @@ /// import { MatDialogRef } from '@angular/material/dialog'; -import { Directive, Inject, InjectionToken } from '@angular/core'; +import { Directive, InjectionToken } from '@angular/core'; import { Store } from '@ngrx/store'; import { AppState } from '@core/core.state'; import { Router } from '@angular/router'; import { PageComponent } from '@shared/components/page.component'; import { CustomDialogContainerComponent } from './custom-dialog-container.component'; import { FormBuilder, Validators } from '@angular/forms'; +import { TbInject } from '@shared/decorators/tb-inject'; export const CUSTOM_DIALOG_DATA = new InjectionToken('ConfigDialogData'); @@ -31,15 +32,16 @@ export interface CustomDialogData { } @Directive() +// tslint:disable-next-line:directive-class-suffix export class CustomDialogComponent extends PageComponent { [key: string]: any; - constructor(protected store: Store, - protected router: Router, - public dialogRef: MatDialogRef, - public fb: FormBuilder, - @Inject(CUSTOM_DIALOG_DATA) public data: CustomDialogData) { + constructor(@TbInject(Store) protected store: Store, + @TbInject(Router) protected router: Router, + @TbInject(MatDialogRef) public dialogRef: MatDialogRef, + @TbInject(FormBuilder) public fb: FormBuilder, + @TbInject(CUSTOM_DIALOG_DATA) public data: CustomDialogData) { super(store); // @ts-ignore this.validators = Validators; diff --git a/ui-ngx/src/app/modules/home/components/widget/dynamic-widget.component.ts b/ui-ngx/src/app/modules/home/components/widget/dynamic-widget.component.ts index 46d1168c09..d73a9b049d 100644 --- a/ui-ngx/src/app/modules/home/components/widget/dynamic-widget.component.ts +++ b/ui-ngx/src/app/modules/home/components/widget/dynamic-widget.component.ts @@ -15,7 +15,7 @@ /// import { PageComponent } from '@shared/components/page.component'; -import { Inject, Injector, OnDestroy, OnInit, Directive } from '@angular/core'; +import { Directive, Injector, OnDestroy, OnInit } from '@angular/core'; import { Store } from '@ngrx/store'; import { AppState } from '@core/core.state'; import { IDynamicWidgetComponent, WidgetContext } from '@home/models/widget-component.models'; @@ -42,8 +42,10 @@ import { DatePipe } from '@angular/common'; import { TranslateService } from '@ngx-translate/core'; import { DomSanitizer } from '@angular/platform-browser'; import { Router } from '@angular/router'; +import { TbInject } from '@shared/decorators/tb-inject'; @Directive() +// tslint:disable-next-line:directive-class-suffix export class DynamicWidgetComponent extends PageComponent implements IDynamicWidgetComponent, OnInit, OnDestroy { executingRpcRequest: boolean; @@ -55,12 +57,12 @@ export class DynamicWidgetComponent extends PageComponent implements IDynamicWid validators = Validators; - constructor(@Inject(RafService) public raf: RafService, - @Inject(Store) protected store: Store, - @Inject(FormBuilder) public fb: FormBuilder, - @Inject(Injector) public readonly $injector: Injector, - @Inject('widgetContext') public readonly ctx: WidgetContext, - @Inject('errorMessages') public readonly errorMessages: string[]) { + constructor(@TbInject(RafService) public raf: RafService, + @TbInject(Store) protected store: Store, + @TbInject(FormBuilder) public fb: FormBuilder, + @TbInject(Injector) public readonly $injector: Injector, + @TbInject('widgetContext') public readonly ctx: WidgetContext, + @TbInject('errorMessages') public readonly errorMessages: string[]) { super(store); this.ctx.$injector = $injector; this.ctx.deviceService = $injector.get(DeviceService); diff --git a/ui-ngx/src/app/shared/decorators/tb-inject.ts b/ui-ngx/src/app/shared/decorators/tb-inject.ts new file mode 100644 index 0000000000..38745993dd --- /dev/null +++ b/ui-ngx/src/app/shared/decorators/tb-inject.ts @@ -0,0 +1,23 @@ +/// +/// 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 { Inject, Type } from '@angular/core'; + +export function TbInject(token: any): (target: Type, key: any, paramIndex: number) => void { + return (target: Type, key: any, paramIndex: number) => { + Inject(token)(target, key, paramIndex); + }; +}