From d2ee78e56ae1705a5b05371e4a7595149a4b7399 Mon Sep 17 00:00:00 2001 From: Fahri Gedik Date: Wed, 16 Jul 2025 19:15:19 +0300 Subject: [PATCH 01/13] Refactor components to use standalone Angular imports on theme-shared package Replaced CommonModule and RouterModule imports with more granular standalone Angular feature imports (NgClass, NgStyle, NgIf, NgTemplateOutlet, RouterLink, etc.) across multiple shared components. This change improves tree-shaking and aligns with Angular's standalone component best practices. --- .../breadcrumb-items/breadcrumb-items.component.ts | 6 +++--- .../src/lib/components/button/button.component.ts | 4 ++-- .../src/lib/components/card/card-body.component.ts | 4 ++-- .../src/lib/components/card/card-footer.component.ts | 4 ++-- .../src/lib/components/card/card-header.component.ts | 4 ++-- .../theme-shared/src/lib/components/card/card.component.ts | 4 ++-- .../src/lib/components/checkbox/checkbox.component.ts | 4 ++-- .../lib/components/confirmation/confirmation.component.ts | 4 ++-- .../src/lib/components/form-input/form-input.component.ts | 4 ++-- .../internet-connection-status.component.ts | 4 ++-- .../src/lib/components/loader-bar/loader-bar.component.ts | 4 ++-- .../src/lib/components/modal/modal.component.ts | 4 ++-- .../src/lib/components/password/password.component.ts | 4 ++-- .../src/lib/components/toast/toast.component.ts | 4 ++-- 14 files changed, 29 insertions(+), 29 deletions(-) diff --git a/npm/ng-packs/packages/theme-shared/src/lib/components/breadcrumb-items/breadcrumb-items.component.ts b/npm/ng-packs/packages/theme-shared/src/lib/components/breadcrumb-items/breadcrumb-items.component.ts index 0c68151d36..e1aba0e5e8 100644 --- a/npm/ng-packs/packages/theme-shared/src/lib/components/breadcrumb-items/breadcrumb-items.component.ts +++ b/npm/ng-packs/packages/theme-shared/src/lib/components/breadcrumb-items/breadcrumb-items.component.ts @@ -1,12 +1,12 @@ import { Component, Input } from '@angular/core'; -import { RouterModule } from '@angular/router'; -import { CommonModule } from '@angular/common'; +import { NgClass, NgTemplateOutlet } from '@angular/common'; +import { RouterLink } from '@angular/router'; import { ABP, LocalizationPipe } from '@abp/ng.core'; @Component({ selector: 'abp-breadcrumb-items', templateUrl: './breadcrumb-items.component.html', - imports: [CommonModule, RouterModule, LocalizationPipe], + imports: [NgClass, NgTemplateOutlet, RouterLink, LocalizationPipe], }) export class BreadcrumbItemsComponent { @Input() items: Partial[] = []; diff --git a/npm/ng-packs/packages/theme-shared/src/lib/components/button/button.component.ts b/npm/ng-packs/packages/theme-shared/src/lib/components/button/button.component.ts index fdebb542a7..2bfbc952e9 100644 --- a/npm/ng-packs/packages/theme-shared/src/lib/components/button/button.component.ts +++ b/npm/ng-packs/packages/theme-shared/src/lib/components/button/button.component.ts @@ -9,7 +9,7 @@ import { Renderer2, ViewChild, } from '@angular/core'; -import { CommonModule } from '@angular/common'; +import { NgClass } from '@angular/common'; import { ABP } from '@abp/ng.core'; @Component({ @@ -29,7 +29,7 @@ import { ABP } from '@abp/ng.core'; `, - imports: [CommonModule], + imports: [NgClass], }) export class ButtonComponent implements OnInit { @Input() diff --git a/npm/ng-packs/packages/theme-shared/src/lib/components/card/card-body.component.ts b/npm/ng-packs/packages/theme-shared/src/lib/components/card/card-body.component.ts index 2376cef02e..35790054b5 100644 --- a/npm/ng-packs/packages/theme-shared/src/lib/components/card/card-body.component.ts +++ b/npm/ng-packs/packages/theme-shared/src/lib/components/card/card-body.component.ts @@ -1,12 +1,12 @@ import { Component, HostBinding, Input } from '@angular/core'; -import { CommonModule } from '@angular/common'; +import { NgClass, NgStyle } from '@angular/common'; @Component({ selector: 'abp-card-body', template: `
`, - imports: [CommonModule], + imports: [NgClass, NgStyle], }) export class CardBodyComponent { @HostBinding('class') componentClass = 'card-body'; diff --git a/npm/ng-packs/packages/theme-shared/src/lib/components/card/card-footer.component.ts b/npm/ng-packs/packages/theme-shared/src/lib/components/card/card-footer.component.ts index 0e09e1fda6..38a798e146 100644 --- a/npm/ng-packs/packages/theme-shared/src/lib/components/card/card-footer.component.ts +++ b/npm/ng-packs/packages/theme-shared/src/lib/components/card/card-footer.component.ts @@ -1,5 +1,5 @@ import { Component, HostBinding, Input } from '@angular/core'; -import { CommonModule } from '@angular/common'; +import { NgClass, NgStyle } from '@angular/common'; @Component({ selector: 'abp-card-footer', @@ -9,7 +9,7 @@ import { CommonModule } from '@angular/common'; `, styles: [], - imports: [CommonModule], + imports: [NgClass, NgStyle], }) export class CardFooterComponent { @HostBinding('class') componentClass = 'card-footer'; diff --git a/npm/ng-packs/packages/theme-shared/src/lib/components/card/card-header.component.ts b/npm/ng-packs/packages/theme-shared/src/lib/components/card/card-header.component.ts index 03e1fa8af4..4857913d77 100644 --- a/npm/ng-packs/packages/theme-shared/src/lib/components/card/card-header.component.ts +++ b/npm/ng-packs/packages/theme-shared/src/lib/components/card/card-header.component.ts @@ -1,5 +1,5 @@ import { Component, HostBinding, Input } from '@angular/core'; -import { CommonModule } from '@angular/common'; +import { NgClass, NgStyle } from '@angular/common'; @Component({ selector: 'abp-card-header', @@ -9,7 +9,7 @@ import { CommonModule } from '@angular/common'; `, styles: [], - imports: [CommonModule], + imports: [NgClass, NgStyle], }) export class CardHeaderComponent { @HostBinding('class') componentClass = 'card-header'; diff --git a/npm/ng-packs/packages/theme-shared/src/lib/components/card/card.component.ts b/npm/ng-packs/packages/theme-shared/src/lib/components/card/card.component.ts index 5c2269b8aa..42973fdcb0 100644 --- a/npm/ng-packs/packages/theme-shared/src/lib/components/card/card.component.ts +++ b/npm/ng-packs/packages/theme-shared/src/lib/components/card/card.component.ts @@ -1,12 +1,12 @@ import { Component, Input } from '@angular/core'; -import { CommonModule } from '@angular/common'; +import { NgClass, NgStyle } from '@angular/common'; @Component({ selector: 'abp-card', template: `
`, - imports: [CommonModule], + imports: [NgClass, NgStyle], }) export class CardComponent { @Input() cardClass: string; diff --git a/npm/ng-packs/packages/theme-shared/src/lib/components/checkbox/checkbox.component.ts b/npm/ng-packs/packages/theme-shared/src/lib/components/checkbox/checkbox.component.ts index 9ee8cb1af5..8cadf828d1 100644 --- a/npm/ng-packs/packages/theme-shared/src/lib/components/checkbox/checkbox.component.ts +++ b/npm/ng-packs/packages/theme-shared/src/lib/components/checkbox/checkbox.component.ts @@ -1,6 +1,6 @@ import { Component, EventEmitter, forwardRef, Input, Output } from '@angular/core'; import { NG_VALUE_ACCESSOR, FormsModule } from '@angular/forms'; -import { CommonModule } from '@angular/common'; +import { NgClass, NgStyle } from '@angular/common'; import { AbstractNgModelComponent, LocalizationPipe } from '@abp/ng.core'; @Component({ @@ -31,7 +31,7 @@ import { AbstractNgModelComponent, LocalizationPipe } from '@abp/ng.core'; multi: true, }, ], - imports: [CommonModule, FormsModule, LocalizationPipe], + imports: [NgClass, NgStyle, FormsModule, LocalizationPipe], }) export class FormCheckboxComponent extends AbstractNgModelComponent { @Input() label?: string; diff --git a/npm/ng-packs/packages/theme-shared/src/lib/components/confirmation/confirmation.component.ts b/npm/ng-packs/packages/theme-shared/src/lib/components/confirmation/confirmation.component.ts index f211b758e3..9f82cc2a40 100644 --- a/npm/ng-packs/packages/theme-shared/src/lib/components/confirmation/confirmation.component.ts +++ b/npm/ng-packs/packages/theme-shared/src/lib/components/confirmation/confirmation.component.ts @@ -1,5 +1,5 @@ import { Component, Inject } from '@angular/core'; -import { CommonModule } from '@angular/common'; +import { NgClass, NgIf, AsyncPipe } from '@angular/common'; import { ReplaySubject } from 'rxjs'; import { Confirmation } from '../../models/confirmation'; import { CONFIRMATION_ICONS, ConfirmationIcons } from '../../tokens/confirmation-icons.token'; @@ -9,7 +9,7 @@ import { LocalizationPipe } from '@abp/ng.core'; selector: 'abp-confirmation', templateUrl: './confirmation.component.html', styleUrls: ['./confirmation.component.scss'], - imports: [CommonModule, LocalizationPipe], + imports: [NgClass, NgIf, AsyncPipe, LocalizationPipe], }) export class ConfirmationComponent { constructor(@Inject(CONFIRMATION_ICONS) private icons: ConfirmationIcons) {} diff --git a/npm/ng-packs/packages/theme-shared/src/lib/components/form-input/form-input.component.ts b/npm/ng-packs/packages/theme-shared/src/lib/components/form-input/form-input.component.ts index 73ad3306b1..2d10ab5709 100644 --- a/npm/ng-packs/packages/theme-shared/src/lib/components/form-input/form-input.component.ts +++ b/npm/ng-packs/packages/theme-shared/src/lib/components/form-input/form-input.component.ts @@ -1,6 +1,6 @@ import { Component, EventEmitter, forwardRef, Input, Output } from '@angular/core'; import { FormsModule, NG_VALUE_ACCESSOR } from '@angular/forms'; -import { CommonModule } from '@angular/common'; +import { NgClass, NgStyle } from '@angular/common'; import { AbstractNgModelComponent, LocalizationPipe } from '@abp/ng.core'; @Component({ @@ -32,7 +32,7 @@ import { AbstractNgModelComponent, LocalizationPipe } from '@abp/ng.core'; multi: true, }, ], - imports: [CommonModule, LocalizationPipe, FormsModule], + imports: [NgClass, NgStyle, LocalizationPipe, FormsModule], }) export class FormInputComponent extends AbstractNgModelComponent { @Input() inputId!: string; diff --git a/npm/ng-packs/packages/theme-shared/src/lib/components/internet-connection-status/internet-connection-status.component.ts b/npm/ng-packs/packages/theme-shared/src/lib/components/internet-connection-status/internet-connection-status.component.ts index 04f5a9a5ab..9963868ed1 100644 --- a/npm/ng-packs/packages/theme-shared/src/lib/components/internet-connection-status/internet-connection-status.component.ts +++ b/npm/ng-packs/packages/theme-shared/src/lib/components/internet-connection-status/internet-connection-status.component.ts @@ -1,10 +1,10 @@ import { Component, inject } from '@angular/core'; -import { InternetConnectionService, LocalizationModule } from '@abp/ng.core'; +import { InternetConnectionService, LocalizationPipe } from '@abp/ng.core'; import { NgbTooltip } from '@ng-bootstrap/ng-bootstrap'; @Component({ selector: 'abp-internet-status', - imports: [LocalizationModule, NgbTooltip], + imports: [LocalizationPipe, NgbTooltip], template: ` @if (!isOnline()) {
diff --git a/npm/ng-packs/packages/theme-shared/src/lib/components/loader-bar/loader-bar.component.ts b/npm/ng-packs/packages/theme-shared/src/lib/components/loader-bar/loader-bar.component.ts index 501fbbb82a..9e6bf2a554 100644 --- a/npm/ng-packs/packages/theme-shared/src/lib/components/loader-bar/loader-bar.component.ts +++ b/npm/ng-packs/packages/theme-shared/src/lib/components/loader-bar/loader-bar.component.ts @@ -1,6 +1,6 @@ import { ChangeDetectorRef, Component, Input, OnDestroy, OnInit } from '@angular/core'; import { Router } from '@angular/router'; -import { CommonModule } from '@angular/common'; +import { NgClass, NgStyle } from '@angular/common'; import { combineLatest, Subscription, timer } from 'rxjs'; import { HttpWaitService, RouterWaitService, SubscriptionService } from '@abp/ng.core'; @@ -21,7 +21,7 @@ import { HttpWaitService, RouterWaitService, SubscriptionService } from '@abp/ng `, styleUrls: ['./loader-bar.component.scss'], providers: [SubscriptionService], - imports: [CommonModule], + imports: [NgClass, NgStyle], }) export class LoaderBarComponent implements OnDestroy, OnInit { protected _isLoading!: boolean; diff --git a/npm/ng-packs/packages/theme-shared/src/lib/components/modal/modal.component.ts b/npm/ng-packs/packages/theme-shared/src/lib/components/modal/modal.component.ts index 3ac175ae6c..5e03aa5e75 100644 --- a/npm/ng-packs/packages/theme-shared/src/lib/components/modal/modal.component.ts +++ b/npm/ng-packs/packages/theme-shared/src/lib/components/modal/modal.component.ts @@ -12,7 +12,7 @@ import { output, viewChild, } from '@angular/core'; -import { CommonModule } from '@angular/common'; +import { NgTemplateOutlet } from '@angular/common'; import { takeUntilDestroyed } from '@angular/core/rxjs-interop'; import { SubscriptionService, uuid } from '@abp/ng.core'; import { NgbModal, NgbModalOptions, NgbModalRef } from '@ng-bootstrap/ng-bootstrap'; @@ -31,7 +31,7 @@ export type ModalSize = 'sm' | 'md' | 'lg' | 'xl'; templateUrl: './modal.component.html', styleUrls: ['./modal.component.scss'], providers: [SubscriptionService], - imports: [CommonModule], + imports: [NgTemplateOutlet], }) export class ModalComponent implements OnInit, OnDestroy, DismissableModal { protected readonly confirmationService = inject(ConfirmationService); diff --git a/npm/ng-packs/packages/theme-shared/src/lib/components/password/password.component.ts b/npm/ng-packs/packages/theme-shared/src/lib/components/password/password.component.ts index a6e670db0b..eee5aa3d58 100644 --- a/npm/ng-packs/packages/theme-shared/src/lib/components/password/password.component.ts +++ b/npm/ng-packs/packages/theme-shared/src/lib/components/password/password.component.ts @@ -1,6 +1,6 @@ import { Component, forwardRef, Input } from '@angular/core'; import { FormsModule, NG_VALUE_ACCESSOR, ReactiveFormsModule } from '@angular/forms'; -import { CommonModule } from '@angular/common'; +import { NgClass } from '@angular/common'; import { AbstractNgModelComponent } from '@abp/ng.core'; import { NgxValidateCoreModule } from '@ngx-validate/core'; @@ -10,7 +10,7 @@ import { NgxValidateCoreModule } from '@ngx-validate/core'; */ @Component({ selector: 'abp-password', - imports: [CommonModule, FormsModule, ReactiveFormsModule, NgxValidateCoreModule], + imports: [NgClass, FormsModule, ReactiveFormsModule, NgxValidateCoreModule], templateUrl: `./password.component.html`, providers: [ { diff --git a/npm/ng-packs/packages/theme-shared/src/lib/components/toast/toast.component.ts b/npm/ng-packs/packages/theme-shared/src/lib/components/toast/toast.component.ts index 8bb1a7126e..7834a87c05 100644 --- a/npm/ng-packs/packages/theme-shared/src/lib/components/toast/toast.component.ts +++ b/npm/ng-packs/packages/theme-shared/src/lib/components/toast/toast.component.ts @@ -1,5 +1,5 @@ import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core'; -import { CommonModule } from '@angular/common'; +import { NgClass } from '@angular/common'; import { Toaster } from '../../models/toaster'; import { LocalizationPipe } from '@abp/ng.core'; @@ -7,7 +7,7 @@ import { LocalizationPipe } from '@abp/ng.core'; selector: 'abp-toast', templateUrl: './toast.component.html', styleUrls: ['./toast.component.scss'], - imports: [CommonModule, LocalizationPipe], + imports: [NgClass, LocalizationPipe], }) export class ToastComponent implements OnInit { @Input() From 45bda9c34451d3f4bc31d8dff310c1ca72aa5e5b Mon Sep 17 00:00:00 2001 From: Fahri Gedik Date: Wed, 16 Jul 2025 19:40:27 +0300 Subject: [PATCH 02/13] refactor : remove unnecessary imports on theme-shared package --- .../components/breadcrumb-items/breadcrumb-items.component.ts | 4 ++-- .../src/lib/components/confirmation/confirmation.component.ts | 4 ++-- .../src/lib/components/password/password.component.ts | 4 ++-- 3 files changed, 6 insertions(+), 6 deletions(-) diff --git a/npm/ng-packs/packages/theme-shared/src/lib/components/breadcrumb-items/breadcrumb-items.component.ts b/npm/ng-packs/packages/theme-shared/src/lib/components/breadcrumb-items/breadcrumb-items.component.ts index e1aba0e5e8..6e60a77669 100644 --- a/npm/ng-packs/packages/theme-shared/src/lib/components/breadcrumb-items/breadcrumb-items.component.ts +++ b/npm/ng-packs/packages/theme-shared/src/lib/components/breadcrumb-items/breadcrumb-items.component.ts @@ -1,12 +1,12 @@ import { Component, Input } from '@angular/core'; -import { NgClass, NgTemplateOutlet } from '@angular/common'; +import { NgTemplateOutlet } from '@angular/common'; import { RouterLink } from '@angular/router'; import { ABP, LocalizationPipe } from '@abp/ng.core'; @Component({ selector: 'abp-breadcrumb-items', templateUrl: './breadcrumb-items.component.html', - imports: [NgClass, NgTemplateOutlet, RouterLink, LocalizationPipe], + imports: [ NgTemplateOutlet, RouterLink, LocalizationPipe], }) export class BreadcrumbItemsComponent { @Input() items: Partial[] = []; diff --git a/npm/ng-packs/packages/theme-shared/src/lib/components/confirmation/confirmation.component.ts b/npm/ng-packs/packages/theme-shared/src/lib/components/confirmation/confirmation.component.ts index 9f82cc2a40..2e912013e7 100644 --- a/npm/ng-packs/packages/theme-shared/src/lib/components/confirmation/confirmation.component.ts +++ b/npm/ng-packs/packages/theme-shared/src/lib/components/confirmation/confirmation.component.ts @@ -1,5 +1,5 @@ import { Component, Inject } from '@angular/core'; -import { NgClass, NgIf, AsyncPipe } from '@angular/common'; +import { NgClass, AsyncPipe } from '@angular/common'; import { ReplaySubject } from 'rxjs'; import { Confirmation } from '../../models/confirmation'; import { CONFIRMATION_ICONS, ConfirmationIcons } from '../../tokens/confirmation-icons.token'; @@ -9,7 +9,7 @@ import { LocalizationPipe } from '@abp/ng.core'; selector: 'abp-confirmation', templateUrl: './confirmation.component.html', styleUrls: ['./confirmation.component.scss'], - imports: [NgClass, NgIf, AsyncPipe, LocalizationPipe], + imports: [NgClass, AsyncPipe, LocalizationPipe], }) export class ConfirmationComponent { constructor(@Inject(CONFIRMATION_ICONS) private icons: ConfirmationIcons) {} diff --git a/npm/ng-packs/packages/theme-shared/src/lib/components/password/password.component.ts b/npm/ng-packs/packages/theme-shared/src/lib/components/password/password.component.ts index eee5aa3d58..eeefb3ac01 100644 --- a/npm/ng-packs/packages/theme-shared/src/lib/components/password/password.component.ts +++ b/npm/ng-packs/packages/theme-shared/src/lib/components/password/password.component.ts @@ -1,5 +1,5 @@ import { Component, forwardRef, Input } from '@angular/core'; -import { FormsModule, NG_VALUE_ACCESSOR, ReactiveFormsModule } from '@angular/forms'; +import { FormsModule, NG_VALUE_ACCESSOR } from '@angular/forms'; import { NgClass } from '@angular/common'; import { AbstractNgModelComponent } from '@abp/ng.core'; import { NgxValidateCoreModule } from '@ngx-validate/core'; @@ -10,7 +10,7 @@ import { NgxValidateCoreModule } from '@ngx-validate/core'; */ @Component({ selector: 'abp-password', - imports: [NgClass, FormsModule, ReactiveFormsModule, NgxValidateCoreModule], + imports: [NgClass, FormsModule, NgxValidateCoreModule], templateUrl: `./password.component.html`, providers: [ { From 07a264f46c62f2ad17dda3020d5bce45b4935390 Mon Sep 17 00:00:00 2001 From: Fahri Gedik Date: Wed, 16 Jul 2025 19:54:36 +0300 Subject: [PATCH 03/13] =?UTF-8?q?Refactor=20components=20to=20use=20standa?= =?UTF-8?q?lone=20Angular=20imports=20on=20acoount=20pa=E2=80=A6?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../components/forgot-password/forgot-password.component.ts | 4 ++-- .../account/src/lib/components/login/login.component.ts | 4 ++-- .../components/manage-profile/manage-profile.component.ts | 5 +++-- .../src/lib/components/register/register.component.ts | 4 ++-- .../components/reset-password/reset-password.component.ts | 4 ++-- 5 files changed, 11 insertions(+), 10 deletions(-) diff --git a/npm/ng-packs/packages/account/src/lib/components/forgot-password/forgot-password.component.ts b/npm/ng-packs/packages/account/src/lib/components/forgot-password/forgot-password.component.ts index 815c95d71c..5d13c829de 100644 --- a/npm/ng-packs/packages/account/src/lib/components/forgot-password/forgot-password.component.ts +++ b/npm/ng-packs/packages/account/src/lib/components/forgot-password/forgot-password.component.ts @@ -9,7 +9,7 @@ import { import { finalize } from 'rxjs/operators'; import { LocalizationPipe } from '@abp/ng.core'; import { ButtonComponent } from '@abp/ng.theme.shared'; -import { RouterModule } from '@angular/router'; +import { RouterLink } from '@angular/router'; import { NgxValidateCoreModule } from '@ngx-validate/core'; @Component({ @@ -17,7 +17,7 @@ import { NgxValidateCoreModule } from '@ngx-validate/core'; templateUrl: 'forgot-password.component.html', imports: [ ReactiveFormsModule, - RouterModule, + RouterLink, LocalizationPipe, ButtonComponent, NgxValidateCoreModule, diff --git a/npm/ng-packs/packages/account/src/lib/components/login/login.component.ts b/npm/ng-packs/packages/account/src/lib/components/login/login.component.ts index 37a3e45442..9144b36ba6 100644 --- a/npm/ng-packs/packages/account/src/lib/components/login/login.component.ts +++ b/npm/ng-packs/packages/account/src/lib/components/login/login.component.ts @@ -5,7 +5,7 @@ import { UntypedFormGroup, Validators, } from '@angular/forms'; -import { RouterModule } from '@angular/router'; +import { RouterLink } from '@angular/router'; import { throwError } from 'rxjs'; import { catchError, finalize } from 'rxjs/operators'; import { @@ -26,7 +26,7 @@ const { maxLength, required } = Validators; templateUrl: './login.component.html', imports: [ ReactiveFormsModule, - RouterModule, + RouterLink, LocalizationPipe, ButtonComponent, NgxValidateCoreModule, diff --git a/npm/ng-packs/packages/account/src/lib/components/manage-profile/manage-profile.component.ts b/npm/ng-packs/packages/account/src/lib/components/manage-profile/manage-profile.component.ts index 797bb9f492..9ad368a8cd 100644 --- a/npm/ng-packs/packages/account/src/lib/components/manage-profile/manage-profile.component.ts +++ b/npm/ng-packs/packages/account/src/lib/components/manage-profile/manage-profile.component.ts @@ -4,7 +4,7 @@ import { transition, trigger, useAnimation } from '@angular/animations'; import { Component, OnInit } from '@angular/core'; import { eAccountComponents } from '../../enums/components'; import { ManageProfileStateService } from '../../services/manage-profile.state.service'; -import { CommonModule } from '@angular/common'; +import { NgClass, AsyncPipe } from '@angular/common'; import { ReactiveFormsModule } from '@angular/forms'; import { LocalizationPipe, ReplaceableTemplateDirective } from '@abp/ng.core'; import { PersonalSettingsComponent } from '../personal-settings/personal-settings.component'; @@ -23,7 +23,8 @@ import { ChangePasswordComponent } from '../change-password/change-password.comp `, ], imports: [ - CommonModule, + NgClass, + AsyncPipe, ReactiveFormsModule, PersonalSettingsComponent, ChangePasswordComponent, diff --git a/npm/ng-packs/packages/account/src/lib/components/register/register.component.ts b/npm/ng-packs/packages/account/src/lib/components/register/register.component.ts index 18b4935c92..7d195821b5 100644 --- a/npm/ng-packs/packages/account/src/lib/components/register/register.component.ts +++ b/npm/ng-packs/packages/account/src/lib/components/register/register.component.ts @@ -18,7 +18,7 @@ import { catchError, finalize, switchMap } from 'rxjs/operators'; import { eAccountComponents } from '../../enums/components'; import { getRedirectUrl } from '../../utils/auth-utils'; import { NgxValidateCoreModule } from '@ngx-validate/core'; -import { RouterModule } from '@angular/router'; +import { RouterLink } from '@angular/router'; const { maxLength, required, email } = Validators; @@ -27,7 +27,7 @@ const { maxLength, required, email } = Validators; templateUrl: './register.component.html', imports: [ ReactiveFormsModule, - RouterModule, + RouterLink, NgxValidateCoreModule, LocalizationPipe, ButtonComponent, diff --git a/npm/ng-packs/packages/account/src/lib/components/reset-password/reset-password.component.ts b/npm/ng-packs/packages/account/src/lib/components/reset-password/reset-password.component.ts index d04a99ae98..38b0ba7de3 100644 --- a/npm/ng-packs/packages/account/src/lib/components/reset-password/reset-password.component.ts +++ b/npm/ng-packs/packages/account/src/lib/components/reset-password/reset-password.component.ts @@ -7,7 +7,7 @@ import { UntypedFormGroup, Validators, } from '@angular/forms'; -import { ActivatedRoute, Router, RouterModule } from '@angular/router'; +import { ActivatedRoute, Router, RouterLink } from '@angular/router'; import { comparePasswords, NgxValidateCoreModule, Validation } from '@ngx-validate/core'; import { finalize } from 'rxjs/operators'; import { LocalizationPipe } from '@abp/ng.core'; @@ -19,7 +19,7 @@ const PASSWORD_FIELDS = ['password', 'confirmPassword']; templateUrl: './reset-password.component.html', imports: [ ReactiveFormsModule, - RouterModule, + RouterLink, NgxValidateCoreModule, LocalizationPipe, ButtonComponent, From ef1c2d6ad1e5ba6786b02cf17a5a0fff94b02fa0 Mon Sep 17 00:00:00 2001 From: Fahri Gedik Date: Wed, 16 Jul 2025 20:05:15 +0300 Subject: [PATCH 04/13] Refactor components to use standalone Angular imports on core package --- .../core/src/lib/components/dynamic-layout.component.ts | 4 ++-- .../lib/components/replaceable-route-container.component.ts | 4 ++-- .../core/src/lib/components/router-outlet.component.ts | 4 ++-- .../packages/core/src/lib/services/router-events.service.ts | 1 - .../core/src/lib/validators/unique-character.validator.ts | 2 +- 5 files changed, 7 insertions(+), 8 deletions(-) diff --git a/npm/ng-packs/packages/core/src/lib/components/dynamic-layout.component.ts b/npm/ng-packs/packages/core/src/lib/components/dynamic-layout.component.ts index 549702a1ad..fbbfa18399 100644 --- a/npm/ng-packs/packages/core/src/lib/components/dynamic-layout.component.ts +++ b/npm/ng-packs/packages/core/src/lib/components/dynamic-layout.component.ts @@ -12,7 +12,7 @@ import { findRoute, getRoutePath } from '../utils/route-utils'; import { TreeNode } from '../utils/tree-utils'; import { DYNAMIC_LAYOUTS_TOKEN } from '../tokens/dynamic-layout.token'; import { EnvironmentService } from '../services'; -import { CommonModule } from '@angular/common'; +import { NgComponentOutlet } from '@angular/common'; @Component({ selector: 'abp-dynamic-layout', @@ -22,7 +22,7 @@ import { CommonModule } from '@angular/common'; } `, providers: [SubscriptionService], - imports: [CommonModule], + imports: [NgComponentOutlet], }) export class DynamicLayoutComponent implements OnInit { layout?: Type; diff --git a/npm/ng-packs/packages/core/src/lib/components/replaceable-route-container.component.ts b/npm/ng-packs/packages/core/src/lib/components/replaceable-route-container.component.ts index 680c7919a8..610bb0fc5e 100644 --- a/npm/ng-packs/packages/core/src/lib/components/replaceable-route-container.component.ts +++ b/npm/ng-packs/packages/core/src/lib/components/replaceable-route-container.component.ts @@ -4,7 +4,7 @@ import { distinctUntilChanged } from 'rxjs/operators'; import { ReplaceableComponents } from '../models/replaceable-components'; import { ReplaceableComponentsService } from '../services/replaceable-components.service'; import { SubscriptionService } from '../services/subscription.service'; -import { CommonModule } from '@angular/common'; +import { NgComponentOutlet } from '@angular/common'; @Component({ selector: 'abp-replaceable-route-container', @@ -12,7 +12,7 @@ import { CommonModule } from '@angular/common'; `, providers: [SubscriptionService], - imports: [CommonModule], + imports: [NgComponentOutlet], }) export class ReplaceableRouteContainerComponent implements OnInit { defaultComponent!: Type; diff --git a/npm/ng-packs/packages/core/src/lib/components/router-outlet.component.ts b/npm/ng-packs/packages/core/src/lib/components/router-outlet.component.ts index 73af8037c2..4a0dc6c099 100644 --- a/npm/ng-packs/packages/core/src/lib/components/router-outlet.component.ts +++ b/npm/ng-packs/packages/core/src/lib/components/router-outlet.component.ts @@ -1,9 +1,9 @@ import { Component } from '@angular/core'; -import { RouterModule } from '@angular/router'; +import { RouterOutlet } from '@angular/router'; @Component({ selector: 'abp-router-outlet', template: ` `, - imports: [RouterModule], + imports: [RouterOutlet], }) export class RouterOutletComponent {} diff --git a/npm/ng-packs/packages/core/src/lib/services/router-events.service.ts b/npm/ng-packs/packages/core/src/lib/services/router-events.service.ts index 0e17b37b04..9722ab7660 100644 --- a/npm/ng-packs/packages/core/src/lib/services/router-events.service.ts +++ b/npm/ng-packs/packages/core/src/lib/services/router-events.service.ts @@ -7,7 +7,6 @@ import { Router, RouterEvent, Event, - RouterState, } from '@angular/router'; import { Observable } from 'rxjs'; import { filter } from 'rxjs/operators'; diff --git a/npm/ng-packs/packages/core/src/lib/validators/unique-character.validator.ts b/npm/ng-packs/packages/core/src/lib/validators/unique-character.validator.ts index 509dc66c7f..150a6f1632 100644 --- a/npm/ng-packs/packages/core/src/lib/validators/unique-character.validator.ts +++ b/npm/ng-packs/packages/core/src/lib/validators/unique-character.validator.ts @@ -1,4 +1,4 @@ -import { AbstractControl, ValidationErrors, ValidatorFn } from '@angular/forms'; +import { AbstractControl, ValidatorFn } from '@angular/forms'; import { isNullOrEmpty } from '../utils'; export interface UniqueCharacterError { From 5542ee8ac02bedeb2ced1e17d9f0e877a7dd3b74 Mon Sep 17 00:00:00 2001 From: Fahri Gedik Date: Wed, 16 Jul 2025 20:28:40 +0300 Subject: [PATCH 05/13] Refactor components to use standalone Angular imports on feature-management package --- .../feature-management/feature-management.component.ts | 5 ++--- 1 file changed, 2 insertions(+), 3 deletions(-) diff --git a/npm/ng-packs/packages/feature-management/src/lib/components/feature-management/feature-management.component.ts b/npm/ng-packs/packages/feature-management/src/lib/components/feature-management/feature-management.component.ts index 85ee18fb78..b59f17972a 100644 --- a/npm/ng-packs/packages/feature-management/src/lib/components/feature-management/feature-management.component.ts +++ b/npm/ng-packs/packages/feature-management/src/lib/components/feature-management/feature-management.component.ts @@ -1,5 +1,5 @@ import { Component, EventEmitter, Input, Output, inject } from '@angular/core'; -import { CommonModule, NgTemplateOutlet } from '@angular/common'; +import { NgTemplateOutlet } from '@angular/common'; import { FormsModule } from '@angular/forms'; import { ConfigStateService, LocalizationPipe, TrackByService } from '@abp/ng.core'; import { @@ -35,14 +35,13 @@ const DEFAULT_PROVIDER_NAME = 'D'; templateUrl: './feature-management.component.html', exportAs: 'abpFeatureManagement', imports: [ - CommonModule, + NgTemplateOutlet, ButtonComponent, ModalComponent, LocalizationPipe, FormsModule, NgbNavModule, FreeTextInputDirective, - NgTemplateOutlet, ModalCloseDirective, ], }) From 2563abc67ee8467458feaecbccc1fbec28a4cdd9 Mon Sep 17 00:00:00 2001 From: Fahri Gedik Date: Wed, 16 Jul 2025 20:31:00 +0300 Subject: [PATCH 06/13] Refactor components to use standalone Angular imports on permission management package --- .../src/lib/components/permission-management.component.ts | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/npm/ng-packs/packages/permission-management/src/lib/components/permission-management.component.ts b/npm/ng-packs/packages/permission-management/src/lib/components/permission-management.component.ts index 671e78893f..dd0492a411 100644 --- a/npm/ng-packs/packages/permission-management/src/lib/components/permission-management.component.ts +++ b/npm/ng-packs/packages/permission-management/src/lib/components/permission-management.component.ts @@ -30,7 +30,7 @@ import { import { concat, of } from 'rxjs'; import { finalize, switchMap, take, tap } from 'rxjs/operators'; import { PermissionManagement } from '../models'; -import { CommonModule } from '@angular/common'; +import { NgStyle } from '@angular/common'; import { FormsModule } from '@angular/forms'; type PermissionWithStyle = PermissionGrantInfoDto & { @@ -94,7 +94,7 @@ type PermissionWithGroupName = PermissionGrantInfoDto & { ], imports: [ FormsModule, - CommonModule, + NgStyle, ModalComponent, LocalizationPipe, ButtonComponent, From 6fb7d5949b1b79c632952f8d61a00800201a7f69 Mon Sep 17 00:00:00 2001 From: Fahri Gedik Date: Wed, 16 Jul 2025 20:32:25 +0300 Subject: [PATCH 07/13] Refactor components to use standalone Angular imports on setting management package --- .../src/lib/components/setting-management.component.ts | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/npm/ng-packs/packages/setting-management/src/lib/components/setting-management.component.ts b/npm/ng-packs/packages/setting-management/src/lib/components/setting-management.component.ts index 7b26a647ce..1cec644ed6 100644 --- a/npm/ng-packs/packages/setting-management/src/lib/components/setting-management.component.ts +++ b/npm/ng-packs/packages/setting-management/src/lib/components/setting-management.component.ts @@ -2,13 +2,13 @@ import { ABP, ForDirective, LocalizationPipe, PermissionDirective } from '@abp/n import { SettingTabsService } from '@abp/ng.setting-management/config'; import { Component, inject, OnDestroy, OnInit, TrackByFunction } from '@angular/core'; import { Subscription } from 'rxjs'; -import { CommonModule } from '@angular/common'; +import { NgComponentOutlet } from '@angular/common'; import { PageComponent } from '@abp/ng.components/page'; @Component({ selector: 'abp-setting-management', templateUrl: './setting-management.component.html', - imports: [CommonModule, PageComponent, LocalizationPipe, PermissionDirective, ForDirective], + imports: [NgComponentOutlet, PageComponent, LocalizationPipe, PermissionDirective, ForDirective], }) export class SettingManagementComponent implements OnDestroy, OnInit { private settingTabsService = inject(SettingTabsService); From 2e054d6fb86f7d407f41ed9d8740508bd7eb5383 Mon Sep 17 00:00:00 2001 From: Fahri Gedik Date: Wed, 16 Jul 2025 20:57:47 +0300 Subject: [PATCH 08/13] Refactor components to use standalone Angular imports on theme-basic package --- .../account-layout/account-layout.component.ts | 8 ++++---- .../auth-wrapper/auth-wrapper.component.ts | 3 +-- .../account-layout/tenant-box/tenant-box.component.ts | 6 ++---- .../application-layout/application-layout.component.ts | 8 ++++---- .../components/empty-layout/empty-layout.component.ts | 4 ++-- .../src/lib/components/logo/logo.component.ts | 3 +-- .../lib/components/nav-items/current-user.component.ts | 4 ++-- .../lib/components/nav-items/languages.component.ts | 4 ++-- .../lib/components/nav-items/nav-items.component.ts | 4 ++-- .../page-alert-container.component.ts | 4 ++-- .../src/lib/components/routes/routes.component.ts | 10 ++++++---- .../validation-error/validation-error.component.ts | 3 +-- 12 files changed, 29 insertions(+), 32 deletions(-) diff --git a/npm/ng-packs/packages/theme-basic/src/lib/components/account-layout/account-layout.component.ts b/npm/ng-packs/packages/theme-basic/src/lib/components/account-layout/account-layout.component.ts index e5b68e8901..04272609d9 100644 --- a/npm/ng-packs/packages/theme-basic/src/lib/components/account-layout/account-layout.component.ts +++ b/npm/ng-packs/packages/theme-basic/src/lib/components/account-layout/account-layout.component.ts @@ -1,27 +1,27 @@ import { AfterViewInit, Component } from '@angular/core'; import { eLayoutType, ReplaceableTemplateDirective, SubscriptionService } from '@abp/ng.core'; import { LayoutService } from '../../services/layout.service'; -import { CommonModule } from '@angular/common'; +import { NgTemplateOutlet } from '@angular/common'; import { LogoComponent } from '../logo/logo.component'; import { RoutesComponent } from '../routes/routes.component'; import { NavItemsComponent } from '../nav-items/nav-items.component'; import { AuthWrapperComponent } from './auth-wrapper/auth-wrapper.component'; import { PageAlertContainerComponent } from '../page-alert-container/page-alert-container.component'; -import { RouterModule } from '@angular/router'; +import { RouterOutlet } from '@angular/router'; @Component({ selector: 'abp-layout-account', templateUrl: './account-layout.component.html', providers: [LayoutService, SubscriptionService], imports: [ - CommonModule, + NgTemplateOutlet, LogoComponent, RoutesComponent, NavItemsComponent, AuthWrapperComponent, PageAlertContainerComponent, ReplaceableTemplateDirective, - RouterModule, + RouterOutlet, ], }) export class AccountLayoutComponent implements AfterViewInit { diff --git a/npm/ng-packs/packages/theme-basic/src/lib/components/account-layout/auth-wrapper/auth-wrapper.component.ts b/npm/ng-packs/packages/theme-basic/src/lib/components/account-layout/auth-wrapper/auth-wrapper.component.ts index 5094551ed2..f1c0eec47b 100644 --- a/npm/ng-packs/packages/theme-basic/src/lib/components/account-layout/auth-wrapper/auth-wrapper.component.ts +++ b/npm/ng-packs/packages/theme-basic/src/lib/components/account-layout/auth-wrapper/auth-wrapper.component.ts @@ -1,6 +1,5 @@ import { AuthWrapperService } from '@abp/ng.account.core'; import { Component } from '@angular/core'; -import { CommonModule } from '@angular/common'; import { LocalizationPipe, ReplaceableTemplateDirective } from '@abp/ng.core'; import { TenantBoxComponent } from '../tenant-box/tenant-box.component'; @@ -8,7 +7,7 @@ import { TenantBoxComponent } from '../tenant-box/tenant-box.component'; selector: 'abp-auth-wrapper', templateUrl: './auth-wrapper.component.html', providers: [AuthWrapperService], - imports: [CommonModule, TenantBoxComponent, ReplaceableTemplateDirective, LocalizationPipe], + imports: [TenantBoxComponent, ReplaceableTemplateDirective, LocalizationPipe], }) export class AuthWrapperComponent { constructor(public service: AuthWrapperService) {} diff --git a/npm/ng-packs/packages/theme-basic/src/lib/components/account-layout/tenant-box/tenant-box.component.ts b/npm/ng-packs/packages/theme-basic/src/lib/components/account-layout/tenant-box/tenant-box.component.ts index 4aadd1effb..156904d855 100644 --- a/npm/ng-packs/packages/theme-basic/src/lib/components/account-layout/tenant-box/tenant-box.component.ts +++ b/npm/ng-packs/packages/theme-basic/src/lib/components/account-layout/tenant-box/tenant-box.component.ts @@ -1,17 +1,15 @@ import { TenantBoxService } from '@abp/ng.account.core'; import { Component } from '@angular/core'; -import { CommonModule } from '@angular/common'; import { LocalizationPipe } from '@abp/ng.core'; import { ButtonComponent, ModalCloseDirective, ModalComponent } from '@abp/ng.theme.shared'; -import { FormsModule } from '@angular/forms'; +import { NgModel } from '@angular/forms'; @Component({ selector: 'abp-tenant-box', templateUrl: './tenant-box.component.html', providers: [TenantBoxService], imports: [ - CommonModule, - FormsModule, + NgModel, ModalComponent, LocalizationPipe, ButtonComponent, diff --git a/npm/ng-packs/packages/theme-basic/src/lib/components/application-layout/application-layout.component.ts b/npm/ng-packs/packages/theme-basic/src/lib/components/application-layout/application-layout.component.ts index 2cfeb978b2..0cebc476a5 100644 --- a/npm/ng-packs/packages/theme-basic/src/lib/components/application-layout/application-layout.component.ts +++ b/npm/ng-packs/packages/theme-basic/src/lib/components/application-layout/application-layout.component.ts @@ -2,8 +2,8 @@ import { eLayoutType, ReplaceableTemplateDirective, SubscriptionService } from ' import { collapseWithMargin, slideFromBottom } from '@abp/ng.theme.shared'; import { AfterViewInit, Component, inject } from '@angular/core'; import { LayoutService } from '../../services/layout.service'; -import { CommonModule } from '@angular/common'; -import { RouterModule } from '@angular/router'; +import { NgTemplateOutlet } from '@angular/common'; +import { RouterOutlet } from '@angular/router'; import { LogoComponent } from '../logo/logo.component'; import { PageAlertContainerComponent } from '../page-alert-container/page-alert-container.component'; import { RoutesComponent } from '../routes/routes.component'; @@ -15,13 +15,13 @@ import { NavItemsComponent } from '../nav-items/nav-items.component'; animations: [slideFromBottom, collapseWithMargin], providers: [LayoutService, SubscriptionService], imports: [ - CommonModule, + NgTemplateOutlet, LogoComponent, PageAlertContainerComponent, RoutesComponent, NavItemsComponent, ReplaceableTemplateDirective, - RouterModule, + RouterOutlet, ], }) export class ApplicationLayoutComponent implements AfterViewInit { diff --git a/npm/ng-packs/packages/theme-basic/src/lib/components/empty-layout/empty-layout.component.ts b/npm/ng-packs/packages/theme-basic/src/lib/components/empty-layout/empty-layout.component.ts index 16cd0951e5..2153ecf2c5 100644 --- a/npm/ng-packs/packages/theme-basic/src/lib/components/empty-layout/empty-layout.component.ts +++ b/npm/ng-packs/packages/theme-basic/src/lib/components/empty-layout/empty-layout.component.ts @@ -1,11 +1,11 @@ import { Component } from '@angular/core'; import { eLayoutType } from '@abp/ng.core'; -import { RouterModule } from '@angular/router'; +import { RouterOutlet } from '@angular/router'; @Component({ selector: 'abp-layout-empty', template: ` `, - imports: [RouterModule], + imports: [RouterOutlet], }) export class EmptyLayoutComponent { static type = eLayoutType.empty; diff --git a/npm/ng-packs/packages/theme-basic/src/lib/components/logo/logo.component.ts b/npm/ng-packs/packages/theme-basic/src/lib/components/logo/logo.component.ts index fcaeacdf1a..5f694d5887 100644 --- a/npm/ng-packs/packages/theme-basic/src/lib/components/logo/logo.component.ts +++ b/npm/ng-packs/packages/theme-basic/src/lib/components/logo/logo.component.ts @@ -1,6 +1,5 @@ import { ApplicationInfo, EnvironmentService } from '@abp/ng.core'; import { Component } from '@angular/core'; -import { CommonModule } from '@angular/common'; @Component({ selector: 'abp-logo', @@ -13,7 +12,7 @@ import { CommonModule } from '@angular/common'; } `, - imports: [CommonModule], + imports: [], }) export class LogoComponent { get appInfo(): ApplicationInfo { diff --git a/npm/ng-packs/packages/theme-basic/src/lib/components/nav-items/current-user.component.ts b/npm/ng-packs/packages/theme-basic/src/lib/components/nav-items/current-user.component.ts index 40f2d4a342..51cd4de8d0 100644 --- a/npm/ng-packs/packages/theme-basic/src/lib/components/nav-items/current-user.component.ts +++ b/npm/ng-packs/packages/theme-basic/src/lib/components/nav-items/current-user.component.ts @@ -11,14 +11,14 @@ import { import { AbpVisibleDirective, UserMenu, UserMenuService } from '@abp/ng.theme.shared'; import { Component, Inject, TrackByFunction } from '@angular/core'; import { Observable } from 'rxjs'; -import { CommonModule } from '@angular/common'; +import { NgClass } from '@angular/common'; import { NgbDropdownModule } from '@ng-bootstrap/ng-bootstrap'; @Component({ selector: 'abp-current-user', templateUrl: './current-user.component.html', imports: [ - CommonModule, + NgClass, NgbDropdownModule, AbpVisibleDirective, PermissionDirective, diff --git a/npm/ng-packs/packages/theme-basic/src/lib/components/nav-items/languages.component.ts b/npm/ng-packs/packages/theme-basic/src/lib/components/nav-items/languages.component.ts index 67d09d300b..8177b013a1 100644 --- a/npm/ng-packs/packages/theme-basic/src/lib/components/nav-items/languages.component.ts +++ b/npm/ng-packs/packages/theme-basic/src/lib/components/nav-items/languages.component.ts @@ -2,7 +2,7 @@ import { ConfigStateService, LanguageInfo, SessionStateService } from '@abp/ng.c import { Component } from '@angular/core'; import { Observable } from 'rxjs'; import { map } from 'rxjs/operators'; -import { CommonModule } from '@angular/common'; +import { NgClass } from '@angular/common'; import { NgbDropdownModule } from '@ng-bootstrap/ng-bootstrap'; @Component({ @@ -39,7 +39,7 @@ import { NgbDropdownModule } from '@ng-bootstrap/ng-bootstrap';
} `, - imports: [CommonModule, NgbDropdownModule], + imports: [NgClass, NgbDropdownModule], }) export class LanguagesComponent { get smallScreen(): boolean { diff --git a/npm/ng-packs/packages/theme-basic/src/lib/components/nav-items/nav-items.component.ts b/npm/ng-packs/packages/theme-basic/src/lib/components/nav-items/nav-items.component.ts index d2e4a516b4..6d479501d5 100644 --- a/npm/ng-packs/packages/theme-basic/src/lib/components/nav-items/nav-items.component.ts +++ b/npm/ng-packs/packages/theme-basic/src/lib/components/nav-items/nav-items.component.ts @@ -1,12 +1,12 @@ import { AbpVisibleDirective, NavItem, NavItemsService } from '@abp/ng.theme.shared'; import { Component, TrackByFunction } from '@angular/core'; -import { CommonModule } from '@angular/common'; +import { NgComponentOutlet } from '@angular/common'; import { PermissionDirective, ToInjectorPipe } from '@abp/ng.core'; @Component({ selector: 'abp-nav-items', templateUrl: 'nav-items.component.html', - imports: [CommonModule, AbpVisibleDirective, PermissionDirective, ToInjectorPipe], + imports: [NgComponentOutlet, AbpVisibleDirective, PermissionDirective, ToInjectorPipe], }) export class NavItemsComponent { trackByFn: TrackByFunction = (_, element) => element.id; diff --git a/npm/ng-packs/packages/theme-basic/src/lib/components/page-alert-container/page-alert-container.component.ts b/npm/ng-packs/packages/theme-basic/src/lib/components/page-alert-container/page-alert-container.component.ts index b28cd6c81b..545ec4eb49 100644 --- a/npm/ng-packs/packages/theme-basic/src/lib/components/page-alert-container/page-alert-container.component.ts +++ b/npm/ng-packs/packages/theme-basic/src/lib/components/page-alert-container/page-alert-container.component.ts @@ -1,13 +1,13 @@ import { Component, ViewEncapsulation } from '@angular/core'; import { PageAlertService } from '@abp/ng.theme.shared'; -import { CommonModule } from '@angular/common'; +import { NgClass } from '@angular/common'; import { LocalizationPipe, SafeHtmlPipe } from '@abp/ng.core'; @Component({ selector: 'abp-page-alert-container', templateUrl: './page-alert-container.component.html', encapsulation: ViewEncapsulation.None, - imports: [CommonModule, LocalizationPipe, SafeHtmlPipe], + imports: [NgClass, LocalizationPipe, SafeHtmlPipe], }) export class PageAlertContainerComponent { constructor(public service: PageAlertService) {} diff --git a/npm/ng-packs/packages/theme-basic/src/lib/components/routes/routes.component.ts b/npm/ng-packs/packages/theme-basic/src/lib/components/routes/routes.component.ts index 5d91c660da..5bc56ee765 100644 --- a/npm/ng-packs/packages/theme-basic/src/lib/components/routes/routes.component.ts +++ b/npm/ng-packs/packages/theme-basic/src/lib/components/routes/routes.component.ts @@ -16,17 +16,19 @@ import { TrackByFunction, ViewChildren, } from '@angular/core'; -import { CommonModule } from '@angular/common'; +import { NgTemplateOutlet, NgClass, AsyncPipe } from '@angular/common'; import { NgbDropdownModule } from '@ng-bootstrap/ng-bootstrap'; -import { RouterModule } from '@angular/router'; +import { RouterLink } from '@angular/router'; import { EllipsisDirective } from '@abp/ng.theme.shared'; @Component({ selector: 'abp-routes', templateUrl: 'routes.component.html', imports: [ - CommonModule, - RouterModule, + NgTemplateOutlet, + NgClass, + AsyncPipe, + RouterLink, NgbDropdownModule, LazyLocalizationPipe, PermissionDirective, diff --git a/npm/ng-packs/packages/theme-basic/src/lib/components/validation-error/validation-error.component.ts b/npm/ng-packs/packages/theme-basic/src/lib/components/validation-error/validation-error.component.ts index bfa9d6cab2..213ebb6306 100644 --- a/npm/ng-packs/packages/theme-basic/src/lib/components/validation-error/validation-error.component.ts +++ b/npm/ng-packs/packages/theme-basic/src/lib/components/validation-error/validation-error.component.ts @@ -1,4 +1,3 @@ -import { CommonModule } from '@angular/common'; import { ChangeDetectionStrategy, Component, ViewEncapsulation } from '@angular/core'; import { Validation, ValidationErrorComponent as ErrorComponent } from '@ngx-validate/core'; import { LocalizationPipe } from '@abp/ng.core'; @@ -14,7 +13,7 @@ import { LocalizationPipe } from '@abp/ng.core'; `, changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, - imports: [CommonModule, LocalizationPipe], + imports: [LocalizationPipe], }) export class ValidationErrorComponent extends ErrorComponent { get abpErrors(): (Validation.Error & { interpoliteParams?: string[] })[] { From 614db43daa1723bb11cc29aaebf8be580838c9e6 Mon Sep 17 00:00:00 2001 From: Fahri Gedik Date: Wed, 16 Jul 2025 21:25:21 +0300 Subject: [PATCH 09/13] Refactor components to use standalone Angular imports on components package --- .../extensible-date-time-picker.component.ts | 2 -- .../extensible-form/extensible-form-prop.component.ts | 6 ++++-- .../components/extensible-form/extensible-form.component.ts | 4 ++-- .../multi-select/extensible-form-multiselect.component.ts | 5 ++--- .../components/tree/src/lib/components/tree.component.ts | 5 +++-- 5 files changed, 11 insertions(+), 11 deletions(-) diff --git a/npm/ng-packs/packages/components/extensible/src/lib/components/date-time-picker/extensible-date-time-picker.component.ts b/npm/ng-packs/packages/components/extensible/src/lib/components/date-time-picker/extensible-date-time-picker.component.ts index 9f4455b1c2..907118283e 100644 --- a/npm/ng-packs/packages/components/extensible/src/lib/components/date-time-picker/extensible-date-time-picker.component.ts +++ b/npm/ng-packs/packages/components/extensible/src/lib/components/date-time-picker/extensible-date-time-picker.component.ts @@ -8,7 +8,6 @@ import { SkipSelf, ViewChild, } from '@angular/core'; -import { CommonModule } from '@angular/common'; import { ControlContainer, ReactiveFormsModule } from '@angular/forms'; import { NgbDateAdapter, @@ -27,7 +26,6 @@ import { selfFactory } from '../../utils/factory.util'; @Component({ exportAs: 'abpExtensibleDateTimePicker', imports: [ - CommonModule, ReactiveFormsModule, NgbDatepickerModule, NgbTimepickerModule, diff --git a/npm/ng-packs/packages/components/extensible/src/lib/components/extensible-form/extensible-form-prop.component.ts b/npm/ng-packs/packages/components/extensible/src/lib/components/extensible-form/extensible-form-prop.component.ts index 401bd15c3d..9ce7970559 100644 --- a/npm/ng-packs/packages/components/extensible/src/lib/components/extensible-form/extensible-form-prop.component.ts +++ b/npm/ng-packs/packages/components/extensible/src/lib/components/extensible-form/extensible-form-prop.component.ts @@ -47,7 +47,7 @@ import { eExtensibleComponents } from '../../enums/components'; import { ExtensibleDateTimePickerComponent } from '../date-time-picker/extensible-date-time-picker.component'; import { NgxValidateCoreModule } from '@ngx-validate/core'; import { ExtensibleFormPropService } from '../../services/extensible-form-prop.service'; -import { CommonModule } from '@angular/common'; +import { NgClass, NgComponentOutlet, NgTemplateOutlet } from '@angular/common'; import { NgbTooltip } from '@ng-bootstrap/ng-bootstrap'; import { ExtensibleFormMultiselectComponent } from '../multi-select/extensible-form-multiselect.component'; @@ -67,7 +67,9 @@ import { ExtensibleFormMultiselectComponent } from '../multi-select/extensible-f ShowPasswordDirective, PermissionDirective, LocalizationModule, - CommonModule, + NgClass, + NgComponentOutlet, + NgTemplateOutlet, FormsModule, ], changeDetection: ChangeDetectionStrategy.OnPush, diff --git a/npm/ng-packs/packages/components/extensible/src/lib/components/extensible-form/extensible-form.component.ts b/npm/ng-packs/packages/components/extensible/src/lib/components/extensible-form/extensible-form.component.ts index 33f6988811..9d81502291 100644 --- a/npm/ng-packs/packages/components/extensible/src/lib/components/extensible-form/extensible-form.component.ts +++ b/npm/ng-packs/packages/components/extensible/src/lib/components/extensible-form/extensible-form.component.ts @@ -17,14 +17,14 @@ import { ExtensionsService } from '../../services/extensions.service'; import { EXTENSIONS_IDENTIFIER } from '../../tokens/extensions.token'; import { selfFactory } from '../../utils/factory.util'; import { ExtensibleFormPropComponent } from './extensible-form-prop.component'; -import { CommonModule } from '@angular/common'; +import { NgClass, NgTemplateOutlet } from '@angular/common'; import { PropDataDirective } from '../../directives/prop-data.directive'; @Component({ exportAs: 'abpExtensibleForm', selector: 'abp-extensible-form', templateUrl: './extensible-form.component.html', - imports: [CommonModule, PropDataDirective, ReactiveFormsModule, ExtensibleFormPropComponent], + imports: [NgClass, NgTemplateOutlet, PropDataDirective, ReactiveFormsModule, ExtensibleFormPropComponent], changeDetection: ChangeDetectionStrategy.OnPush, viewProviders: [ { diff --git a/npm/ng-packs/packages/components/extensible/src/lib/components/multi-select/extensible-form-multiselect.component.ts b/npm/ng-packs/packages/components/extensible/src/lib/components/multi-select/extensible-form-multiselect.component.ts index 96860b31b4..900800ee59 100644 --- a/npm/ng-packs/packages/components/extensible/src/lib/components/multi-select/extensible-form-multiselect.component.ts +++ b/npm/ng-packs/packages/components/extensible/src/lib/components/multi-select/extensible-form-multiselect.component.ts @@ -1,6 +1,5 @@ import { Component, ChangeDetectionStrategy, forwardRef, input } from '@angular/core'; -import { NG_VALUE_ACCESSOR, ControlValueAccessor, ReactiveFormsModule } from '@angular/forms'; -import { CommonModule } from '@angular/common'; +import { NG_VALUE_ACCESSOR, ControlValueAccessor } from '@angular/forms'; import { ABP, LocalizationPipe } from '@abp/ng.core'; import { FormProp } from '../../models/form-props'; import { NgxValidateCoreModule } from '@ngx-validate/core'; @@ -37,7 +36,7 @@ const EXTENSIBLE_FORM_MULTI_SELECT_CONTROL_VALUE_ACCESSOR = { `, providers: [EXTENSIBLE_FORM_MULTI_SELECT_CONTROL_VALUE_ACCESSOR], - imports: [LocalizationPipe, CommonModule, ReactiveFormsModule, NgxValidateCoreModule], + imports: [LocalizationPipe, NgxValidateCoreModule], changeDetection: ChangeDetectionStrategy.OnPush, }) export class ExtensibleFormMultiselectComponent implements ControlValueAccessor { diff --git a/npm/ng-packs/packages/components/tree/src/lib/components/tree.component.ts b/npm/ng-packs/packages/components/tree/src/lib/components/tree.component.ts index 334ff11414..72fd1232eb 100644 --- a/npm/ng-packs/packages/components/tree/src/lib/components/tree.component.ts +++ b/npm/ng-packs/packages/components/tree/src/lib/components/tree.component.ts @@ -28,7 +28,7 @@ import { of } from 'rxjs'; import { DISABLE_TREE_STYLE_LOADING_TOKEN } from '../disable-tree-style-loading.token'; import { TreeNodeTemplateDirective } from '../templates/tree-node-template.directive'; import { ExpandedIconTemplateDirective } from '../templates/expanded-icon-template.directive'; -import { CommonModule } from '@angular/common'; +import { NgClass, NgTemplateOutlet } from '@angular/common'; import { NzNoAnimationDirective } from 'ng-zorro-antd/core/no-animation'; export type DropEvent = NzFormatEmitEvent & { pos: number }; @@ -41,7 +41,8 @@ export type DropEvent = NzFormatEmitEvent & { pos: number }; providers: [SubscriptionService], changeDetection: ChangeDetectionStrategy.OnPush, imports: [ - CommonModule, + NgClass, + NgTemplateOutlet, NzTreeComponent, NgbDropdown, NgbDropdownMenu, From f4fb510c89ce9f960f5f5a9929bb76bc5a580074 Mon Sep 17 00:00:00 2001 From: Fahri Gedik Date: Wed, 16 Jul 2025 21:31:03 +0300 Subject: [PATCH 10/13] Refactor components to use standalone Angular imports on dev-app --- npm/ng-packs/apps/dev-app/src/app/home/home.component.ts | 4 ++-- templates/app-nolayers/angular/src/app/home/home.component.ts | 4 ++-- templates/app/angular/src/app/home/home.component.ts | 4 ++-- 3 files changed, 6 insertions(+), 6 deletions(-) diff --git a/npm/ng-packs/apps/dev-app/src/app/home/home.component.ts b/npm/ng-packs/apps/dev-app/src/app/home/home.component.ts index 4a6287a7c0..44bf9f269e 100644 --- a/npm/ng-packs/apps/dev-app/src/app/home/home.component.ts +++ b/npm/ng-packs/apps/dev-app/src/app/home/home.component.ts @@ -1,12 +1,12 @@ import { AuthService, LocalizationPipe } from '@abp/ng.core'; import { Component, inject } from '@angular/core'; -import { CommonModule } from '@angular/common'; +import { NgTemplateOutlet } from '@angular/common'; import { ButtonComponent, CardBodyComponent, CardComponent } from '@abp/ng.theme.shared'; @Component({ selector: 'app-home', templateUrl: './home.component.html', - imports: [CommonModule, LocalizationPipe, CardComponent, CardBodyComponent, ButtonComponent], + imports: [NgTemplateOutlet, LocalizationPipe, CardComponent, CardBodyComponent, ButtonComponent], }) export class HomeComponent { protected readonly authService = inject(AuthService); diff --git a/templates/app-nolayers/angular/src/app/home/home.component.ts b/templates/app-nolayers/angular/src/app/home/home.component.ts index 4fa3761541..3a5856c7c2 100644 --- a/templates/app-nolayers/angular/src/app/home/home.component.ts +++ b/templates/app-nolayers/angular/src/app/home/home.component.ts @@ -1,12 +1,12 @@ import {AuthService, LocalizationPipe} from '@abp/ng.core'; import { Component, inject } from '@angular/core'; -import {CommonModule} from "@angular/common"; +import {NgTemplateOutlet} from "@angular/common"; @Component({ selector: 'app-home', templateUrl: './home.component.html', styleUrls: ['./home.component.scss'], - imports: [CommonModule, LocalizationPipe], + imports: [NgTemplateOutlet, LocalizationPipe], }) export class HomeComponent { private authService = inject(AuthService); diff --git a/templates/app/angular/src/app/home/home.component.ts b/templates/app/angular/src/app/home/home.component.ts index cf42b0f606..420edd4724 100644 --- a/templates/app/angular/src/app/home/home.component.ts +++ b/templates/app/angular/src/app/home/home.component.ts @@ -1,12 +1,12 @@ import {AuthService, LocalizationPipe} from '@abp/ng.core'; import { Component, inject } from '@angular/core'; -import {CommonModule} from "@angular/common"; +import {NgTemplateOutlet} from "@angular/common"; @Component({ selector: 'app-home', templateUrl: './home.component.html', styleUrls: ['./home.component.scss'], - imports: [CommonModule, LocalizationPipe] + imports: [NgTemplateOutlet, LocalizationPipe] }) export class HomeComponent { private authService = inject(AuthService); From 80448947f6dfcb820c660ff69405dc538e13a986 Mon Sep 17 00:00:00 2001 From: Fahri Gedik Date: Wed, 16 Jul 2025 23:07:30 +0300 Subject: [PATCH 11/13] refactor : fix build error. Added AsyncPipe to the imports array of several Angular components to support async data binding in templates. This change improves template handling of observables and aligns with Angular best practices. --- .../account-layout/auth-wrapper/auth-wrapper.component.ts | 3 ++- .../account-layout/tenant-box/tenant-box.component.ts | 6 ++++-- .../src/lib/components/nav-items/current-user.component.ts | 3 ++- .../src/lib/components/nav-items/languages.component.ts | 4 ++-- .../src/lib/components/nav-items/nav-items.component.ts | 4 ++-- .../page-alert-container/page-alert-container.component.ts | 4 ++-- 6 files changed, 14 insertions(+), 10 deletions(-) diff --git a/npm/ng-packs/packages/theme-basic/src/lib/components/account-layout/auth-wrapper/auth-wrapper.component.ts b/npm/ng-packs/packages/theme-basic/src/lib/components/account-layout/auth-wrapper/auth-wrapper.component.ts index f1c0eec47b..d71a311f60 100644 --- a/npm/ng-packs/packages/theme-basic/src/lib/components/account-layout/auth-wrapper/auth-wrapper.component.ts +++ b/npm/ng-packs/packages/theme-basic/src/lib/components/account-layout/auth-wrapper/auth-wrapper.component.ts @@ -1,13 +1,14 @@ import { AuthWrapperService } from '@abp/ng.account.core'; import { Component } from '@angular/core'; import { LocalizationPipe, ReplaceableTemplateDirective } from '@abp/ng.core'; +import { AsyncPipe } from '@angular/common'; import { TenantBoxComponent } from '../tenant-box/tenant-box.component'; @Component({ selector: 'abp-auth-wrapper', templateUrl: './auth-wrapper.component.html', providers: [AuthWrapperService], - imports: [TenantBoxComponent, ReplaceableTemplateDirective, LocalizationPipe], + imports: [TenantBoxComponent, ReplaceableTemplateDirective, LocalizationPipe, AsyncPipe], }) export class AuthWrapperComponent { constructor(public service: AuthWrapperService) {} diff --git a/npm/ng-packs/packages/theme-basic/src/lib/components/account-layout/tenant-box/tenant-box.component.ts b/npm/ng-packs/packages/theme-basic/src/lib/components/account-layout/tenant-box/tenant-box.component.ts index 156904d855..fc11db5d6b 100644 --- a/npm/ng-packs/packages/theme-basic/src/lib/components/account-layout/tenant-box/tenant-box.component.ts +++ b/npm/ng-packs/packages/theme-basic/src/lib/components/account-layout/tenant-box/tenant-box.component.ts @@ -2,14 +2,16 @@ import { TenantBoxService } from '@abp/ng.account.core'; import { Component } from '@angular/core'; import { LocalizationPipe } from '@abp/ng.core'; import { ButtonComponent, ModalCloseDirective, ModalComponent } from '@abp/ng.theme.shared'; -import { NgModel } from '@angular/forms'; +import { FormsModule } from '@angular/forms'; +import { AsyncPipe } from '@angular/common'; @Component({ selector: 'abp-tenant-box', templateUrl: './tenant-box.component.html', providers: [TenantBoxService], imports: [ - NgModel, + FormsModule, + AsyncPipe, ModalComponent, LocalizationPipe, ButtonComponent, diff --git a/npm/ng-packs/packages/theme-basic/src/lib/components/nav-items/current-user.component.ts b/npm/ng-packs/packages/theme-basic/src/lib/components/nav-items/current-user.component.ts index 51cd4de8d0..217187df4b 100644 --- a/npm/ng-packs/packages/theme-basic/src/lib/components/nav-items/current-user.component.ts +++ b/npm/ng-packs/packages/theme-basic/src/lib/components/nav-items/current-user.component.ts @@ -11,7 +11,7 @@ import { import { AbpVisibleDirective, UserMenu, UserMenuService } from '@abp/ng.theme.shared'; import { Component, Inject, TrackByFunction } from '@angular/core'; import { Observable } from 'rxjs'; -import { NgClass } from '@angular/common'; +import { NgClass, AsyncPipe } from '@angular/common'; import { NgbDropdownModule } from '@ng-bootstrap/ng-bootstrap'; @Component({ @@ -19,6 +19,7 @@ import { NgbDropdownModule } from '@ng-bootstrap/ng-bootstrap'; templateUrl: './current-user.component.html', imports: [ NgClass, + AsyncPipe, NgbDropdownModule, AbpVisibleDirective, PermissionDirective, diff --git a/npm/ng-packs/packages/theme-basic/src/lib/components/nav-items/languages.component.ts b/npm/ng-packs/packages/theme-basic/src/lib/components/nav-items/languages.component.ts index 8177b013a1..b8c3b6cc1d 100644 --- a/npm/ng-packs/packages/theme-basic/src/lib/components/nav-items/languages.component.ts +++ b/npm/ng-packs/packages/theme-basic/src/lib/components/nav-items/languages.component.ts @@ -2,7 +2,7 @@ import { ConfigStateService, LanguageInfo, SessionStateService } from '@abp/ng.c import { Component } from '@angular/core'; import { Observable } from 'rxjs'; import { map } from 'rxjs/operators'; -import { NgClass } from '@angular/common'; +import { NgClass, AsyncPipe } from '@angular/common'; import { NgbDropdownModule } from '@ng-bootstrap/ng-bootstrap'; @Component({ @@ -39,7 +39,7 @@ import { NgbDropdownModule } from '@ng-bootstrap/ng-bootstrap'; } `, - imports: [NgClass, NgbDropdownModule], + imports: [NgClass, AsyncPipe, NgbDropdownModule], }) export class LanguagesComponent { get smallScreen(): boolean { diff --git a/npm/ng-packs/packages/theme-basic/src/lib/components/nav-items/nav-items.component.ts b/npm/ng-packs/packages/theme-basic/src/lib/components/nav-items/nav-items.component.ts index 6d479501d5..2c84430483 100644 --- a/npm/ng-packs/packages/theme-basic/src/lib/components/nav-items/nav-items.component.ts +++ b/npm/ng-packs/packages/theme-basic/src/lib/components/nav-items/nav-items.component.ts @@ -1,12 +1,12 @@ import { AbpVisibleDirective, NavItem, NavItemsService } from '@abp/ng.theme.shared'; import { Component, TrackByFunction } from '@angular/core'; -import { NgComponentOutlet } from '@angular/common'; +import { NgComponentOutlet, AsyncPipe } from '@angular/common'; import { PermissionDirective, ToInjectorPipe } from '@abp/ng.core'; @Component({ selector: 'abp-nav-items', templateUrl: 'nav-items.component.html', - imports: [NgComponentOutlet, AbpVisibleDirective, PermissionDirective, ToInjectorPipe], + imports: [NgComponentOutlet, AsyncPipe, AbpVisibleDirective, PermissionDirective, ToInjectorPipe], }) export class NavItemsComponent { trackByFn: TrackByFunction = (_, element) => element.id; diff --git a/npm/ng-packs/packages/theme-basic/src/lib/components/page-alert-container/page-alert-container.component.ts b/npm/ng-packs/packages/theme-basic/src/lib/components/page-alert-container/page-alert-container.component.ts index 545ec4eb49..e4e388e29d 100644 --- a/npm/ng-packs/packages/theme-basic/src/lib/components/page-alert-container/page-alert-container.component.ts +++ b/npm/ng-packs/packages/theme-basic/src/lib/components/page-alert-container/page-alert-container.component.ts @@ -1,13 +1,13 @@ import { Component, ViewEncapsulation } from '@angular/core'; import { PageAlertService } from '@abp/ng.theme.shared'; -import { NgClass } from '@angular/common'; +import { NgClass, AsyncPipe } from '@angular/common'; import { LocalizationPipe, SafeHtmlPipe } from '@abp/ng.core'; @Component({ selector: 'abp-page-alert-container', templateUrl: './page-alert-container.component.html', encapsulation: ViewEncapsulation.None, - imports: [NgClass, LocalizationPipe, SafeHtmlPipe], + imports: [NgClass, AsyncPipe, LocalizationPipe, SafeHtmlPipe], }) export class PageAlertContainerComponent { constructor(public service: PageAlertService) {} From f3070a510f992877305f2c15043591a99e14cab3 Mon Sep 17 00:00:00 2001 From: Fahri Gedik Date: Thu, 24 Jul 2025 11:57:18 +0300 Subject: [PATCH 12/13] Refactor imports for Angular standalone components --- .../extensible-form/extensible-form-prop.component.ts | 4 ++-- .../components/extensible-table/extensible-table.component.ts | 4 ++-- .../src/lib/components/grid-actions/grid-actions.component.ts | 4 ++-- .../src/lib/components/page-toolbar/page-toolbar.component.ts | 4 ++-- .../components/tree/src/lib/components/tree.component.ts | 3 +-- .../theme-basic/src/lib/components/logo/logo.component.ts | 3 ++- .../src/lib/components/nav-items/current-user.component.ts | 4 ++-- .../src/lib/components/nav-items/languages.component.ts | 4 ++-- 8 files changed, 15 insertions(+), 15 deletions(-) diff --git a/npm/ng-packs/packages/components/extensible/src/lib/components/extensible-form/extensible-form-prop.component.ts b/npm/ng-packs/packages/components/extensible/src/lib/components/extensible-form/extensible-form-prop.component.ts index 9ce7970559..e31a3a46cc 100644 --- a/npm/ng-packs/packages/components/extensible/src/lib/components/extensible-form/extensible-form-prop.component.ts +++ b/npm/ng-packs/packages/components/extensible/src/lib/components/extensible-form/extensible-form-prop.component.ts @@ -1,7 +1,7 @@ import { EXTENSIONS_FORM_PROP, EXTENSIONS_FORM_PROP_DATA } from './../../tokens/extensions.token'; import { ABP, - LocalizationModule, + LocalizationPipe, PermissionDirective, ShowPasswordDirective, TrackByService, @@ -66,7 +66,7 @@ import { ExtensibleFormMultiselectComponent } from '../multi-select/extensible-f NgbTypeaheadModule, ShowPasswordDirective, PermissionDirective, - LocalizationModule, + LocalizationPipe, NgClass, NgComponentOutlet, NgTemplateOutlet, diff --git a/npm/ng-packs/packages/components/extensible/src/lib/components/extensible-table/extensible-table.component.ts b/npm/ng-packs/packages/components/extensible/src/lib/components/extensible-table/extensible-table.component.ts index bcdfffdfa4..0705f4bae6 100644 --- a/npm/ng-packs/packages/components/extensible/src/lib/components/extensible-table/extensible-table.component.ts +++ b/npm/ng-packs/packages/components/extensible/src/lib/components/extensible-table/extensible-table.component.ts @@ -25,7 +25,7 @@ import { ABP, ConfigStateService, ListService, - LocalizationModule, + LocalizationPipe, PermissionDirective, PermissionService, TimezoneService, @@ -63,7 +63,7 @@ const DEFAULT_ACTIONS_COLUMN_WIDTH = 150; NgxDatatableDefaultDirective, NgxDatatableListDirective, PermissionDirective, - LocalizationModule, + LocalizationPipe, UtcToLocalPipe, AsyncPipe, NgTemplateOutlet, diff --git a/npm/ng-packs/packages/components/extensible/src/lib/components/grid-actions/grid-actions.component.ts b/npm/ng-packs/packages/components/extensible/src/lib/components/grid-actions/grid-actions.component.ts index 5307a4a671..8d6760c710 100644 --- a/npm/ng-packs/packages/components/extensible/src/lib/components/grid-actions/grid-actions.component.ts +++ b/npm/ng-packs/packages/components/extensible/src/lib/components/grid-actions/grid-actions.component.ts @@ -9,7 +9,7 @@ import { EntityAction, EntityActionList } from '../../models/entity-actions'; import { EXTENSIONS_ACTION_TYPE } from '../../tokens/extensions.token'; import { AbstractActionsComponent } from '../abstract-actions/abstract-actions.component'; import { NgbDropdownModule, NgbTooltipModule } from '@ng-bootstrap/ng-bootstrap'; -import { LocalizationModule, PermissionDirective } from '@abp/ng.core'; +import { LocalizationPipe, PermissionDirective } from '@abp/ng.core'; import { EllipsisDirective } from '@abp/ng.theme.shared'; import { NgClass, NgTemplateOutlet } from '@angular/common'; @@ -20,7 +20,7 @@ import { NgClass, NgTemplateOutlet } from '@angular/common'; EllipsisDirective, PermissionDirective, NgClass, - LocalizationModule, + LocalizationPipe, NgTemplateOutlet, NgbTooltipModule, ], diff --git a/npm/ng-packs/packages/components/extensible/src/lib/components/page-toolbar/page-toolbar.component.ts b/npm/ng-packs/packages/components/extensible/src/lib/components/page-toolbar/page-toolbar.component.ts index 7492b6f94e..686fb54180 100644 --- a/npm/ng-packs/packages/components/extensible/src/lib/components/page-toolbar/page-toolbar.component.ts +++ b/npm/ng-packs/packages/components/extensible/src/lib/components/page-toolbar/page-toolbar.component.ts @@ -9,7 +9,7 @@ import { import { EXTENSIONS_ACTION_TYPE } from '../../tokens/extensions.token'; import { AbstractActionsComponent } from '../abstract-actions/abstract-actions.component'; import { CreateInjectorPipe } from '../../pipes/create-injector.pipe'; -import { LocalizationModule, PermissionDirective } from '@abp/ng.core'; +import { LocalizationPipe, PermissionDirective } from '@abp/ng.core'; import { NgClass, NgComponentOutlet } from '@angular/common'; @Component({ @@ -18,7 +18,7 @@ import { NgClass, NgComponentOutlet } from '@angular/common'; imports: [ CreateInjectorPipe, PermissionDirective, - LocalizationModule, + LocalizationPipe, NgClass, NgComponentOutlet, ], diff --git a/npm/ng-packs/packages/components/tree/src/lib/components/tree.component.ts b/npm/ng-packs/packages/components/tree/src/lib/components/tree.component.ts index 72fd1232eb..316200704b 100644 --- a/npm/ng-packs/packages/components/tree/src/lib/components/tree.component.ts +++ b/npm/ng-packs/packages/components/tree/src/lib/components/tree.component.ts @@ -28,7 +28,7 @@ import { of } from 'rxjs'; import { DISABLE_TREE_STYLE_LOADING_TOKEN } from '../disable-tree-style-loading.token'; import { TreeNodeTemplateDirective } from '../templates/tree-node-template.directive'; import { ExpandedIconTemplateDirective } from '../templates/expanded-icon-template.directive'; -import { NgClass, NgTemplateOutlet } from '@angular/common'; +import { NgTemplateOutlet } from '@angular/common'; import { NzNoAnimationDirective } from 'ng-zorro-antd/core/no-animation'; export type DropEvent = NzFormatEmitEvent & { pos: number }; @@ -41,7 +41,6 @@ export type DropEvent = NzFormatEmitEvent & { pos: number }; providers: [SubscriptionService], changeDetection: ChangeDetectionStrategy.OnPush, imports: [ - NgClass, NgTemplateOutlet, NzTreeComponent, NgbDropdown, diff --git a/npm/ng-packs/packages/theme-basic/src/lib/components/logo/logo.component.ts b/npm/ng-packs/packages/theme-basic/src/lib/components/logo/logo.component.ts index 5f694d5887..db0e9417f6 100644 --- a/npm/ng-packs/packages/theme-basic/src/lib/components/logo/logo.component.ts +++ b/npm/ng-packs/packages/theme-basic/src/lib/components/logo/logo.component.ts @@ -1,5 +1,6 @@ import { ApplicationInfo, EnvironmentService } from '@abp/ng.core'; import { Component } from '@angular/core'; +import { RouterLink } from '@angular/router'; @Component({ selector: 'abp-logo', @@ -12,7 +13,7 @@ import { Component } from '@angular/core'; } `, - imports: [], + imports: [RouterLink], }) export class LogoComponent { get appInfo(): ApplicationInfo { diff --git a/npm/ng-packs/packages/theme-basic/src/lib/components/nav-items/current-user.component.ts b/npm/ng-packs/packages/theme-basic/src/lib/components/nav-items/current-user.component.ts index 217187df4b..c58f8f86bf 100644 --- a/npm/ng-packs/packages/theme-basic/src/lib/components/nav-items/current-user.component.ts +++ b/npm/ng-packs/packages/theme-basic/src/lib/components/nav-items/current-user.component.ts @@ -11,14 +11,14 @@ import { import { AbpVisibleDirective, UserMenu, UserMenuService } from '@abp/ng.theme.shared'; import { Component, Inject, TrackByFunction } from '@angular/core'; import { Observable } from 'rxjs'; -import { NgClass, AsyncPipe } from '@angular/common'; +import { NgComponentOutlet, AsyncPipe } from '@angular/common'; import { NgbDropdownModule } from '@ng-bootstrap/ng-bootstrap'; @Component({ selector: 'abp-current-user', templateUrl: './current-user.component.html', imports: [ - NgClass, + NgComponentOutlet, AsyncPipe, NgbDropdownModule, AbpVisibleDirective, diff --git a/npm/ng-packs/packages/theme-basic/src/lib/components/nav-items/languages.component.ts b/npm/ng-packs/packages/theme-basic/src/lib/components/nav-items/languages.component.ts index b8c3b6cc1d..b217f951f8 100644 --- a/npm/ng-packs/packages/theme-basic/src/lib/components/nav-items/languages.component.ts +++ b/npm/ng-packs/packages/theme-basic/src/lib/components/nav-items/languages.component.ts @@ -2,7 +2,7 @@ import { ConfigStateService, LanguageInfo, SessionStateService } from '@abp/ng.c import { Component } from '@angular/core'; import { Observable } from 'rxjs'; import { map } from 'rxjs/operators'; -import { NgClass, AsyncPipe } from '@angular/common'; +import { AsyncPipe } from '@angular/common'; import { NgbDropdownModule } from '@ng-bootstrap/ng-bootstrap'; @Component({ @@ -39,7 +39,7 @@ import { NgbDropdownModule } from '@ng-bootstrap/ng-bootstrap'; } `, - imports: [NgClass, AsyncPipe, NgbDropdownModule], + imports: [AsyncPipe, NgbDropdownModule], }) export class LanguagesComponent { get smallScreen(): boolean { From f978444c9c3f8acb53f52c2935429195ef14c39a Mon Sep 17 00:00:00 2001 From: sumeyye Date: Thu, 24 Jul 2025 14:32:13 +0300 Subject: [PATCH 13/13] update: remove redundant imports and add missing ones --- .../account-layout/auth-wrapper/auth-wrapper.component.ts | 2 +- .../account-layout/tenant-box/tenant-box.component.ts | 2 +- .../page-alert-container/page-alert-container.component.ts | 2 +- .../src/lib/components/loader-bar/loader-bar.component.ts | 1 - 4 files changed, 3 insertions(+), 4 deletions(-) diff --git a/npm/ng-packs/packages/theme-basic/src/lib/components/account-layout/auth-wrapper/auth-wrapper.component.ts b/npm/ng-packs/packages/theme-basic/src/lib/components/account-layout/auth-wrapper/auth-wrapper.component.ts index 5da6292bd3..e87c55dd04 100644 --- a/npm/ng-packs/packages/theme-basic/src/lib/components/account-layout/auth-wrapper/auth-wrapper.component.ts +++ b/npm/ng-packs/packages/theme-basic/src/lib/components/account-layout/auth-wrapper/auth-wrapper.component.ts @@ -8,7 +8,7 @@ import { TenantBoxComponent } from '../tenant-box/tenant-box.component'; selector: 'abp-auth-wrapper', templateUrl: './auth-wrapper.component.html', providers: [AuthWrapperService], - imports: [CommonModule, TenantBoxComponent, ReplaceableTemplateDirective, LocalizationPipe], + imports: [AsyncPipe, TenantBoxComponent, ReplaceableTemplateDirective, LocalizationPipe], }) export class AuthWrapperComponent { service = inject(AuthWrapperService); diff --git a/npm/ng-packs/packages/theme-basic/src/lib/components/account-layout/tenant-box/tenant-box.component.ts b/npm/ng-packs/packages/theme-basic/src/lib/components/account-layout/tenant-box/tenant-box.component.ts index 42cf5b34a0..c9897fed59 100644 --- a/npm/ng-packs/packages/theme-basic/src/lib/components/account-layout/tenant-box/tenant-box.component.ts +++ b/npm/ng-packs/packages/theme-basic/src/lib/components/account-layout/tenant-box/tenant-box.component.ts @@ -10,7 +10,7 @@ import { FormsModule } from '@angular/forms'; templateUrl: './tenant-box.component.html', providers: [TenantBoxService], imports: [ - CommonModule, + AsyncPipe, FormsModule, ModalComponent, LocalizationPipe, diff --git a/npm/ng-packs/packages/theme-basic/src/lib/components/page-alert-container/page-alert-container.component.ts b/npm/ng-packs/packages/theme-basic/src/lib/components/page-alert-container/page-alert-container.component.ts index a32b454f8e..f40ba2cd91 100644 --- a/npm/ng-packs/packages/theme-basic/src/lib/components/page-alert-container/page-alert-container.component.ts +++ b/npm/ng-packs/packages/theme-basic/src/lib/components/page-alert-container/page-alert-container.component.ts @@ -7,7 +7,7 @@ import { LocalizationPipe, SafeHtmlPipe } from '@abp/ng.core'; selector: 'abp-page-alert-container', templateUrl: './page-alert-container.component.html', encapsulation: ViewEncapsulation.None, - imports: [CommonModule, LocalizationPipe, SafeHtmlPipe], + imports: [NgClass, AsyncPipe, LocalizationPipe, SafeHtmlPipe], }) export class PageAlertContainerComponent { service = inject(PageAlertService); diff --git a/npm/ng-packs/packages/theme-shared/src/lib/components/loader-bar/loader-bar.component.ts b/npm/ng-packs/packages/theme-shared/src/lib/components/loader-bar/loader-bar.component.ts index 0d1bb19d01..244b055322 100644 --- a/npm/ng-packs/packages/theme-shared/src/lib/components/loader-bar/loader-bar.component.ts +++ b/npm/ng-packs/packages/theme-shared/src/lib/components/loader-bar/loader-bar.component.ts @@ -1,4 +1,3 @@ -import { Router } from '@angular/router'; import { NgClass, NgStyle } from '@angular/common'; import { ChangeDetectorRef, Component, Input, OnDestroy, OnInit, inject } from '@angular/core'; import { combineLatest, Subscription, timer } from 'rxjs';