From b87699dc8d463b0e9a41fd84cddb88420f2080ac Mon Sep 17 00:00:00 2001 From: Artem Dzhereleiko Date: Tue, 23 Jan 2024 11:20:36 +0200 Subject: [PATCH 1/5] UI: Fixed progress bar --- .../vc/repository-settings.component.html | 2 +- .../vc/repository-settings.component.ts | 3 +++ .../vc/version-control.component.html | 6 ++++-- ui-ngx/src/app/modules/home/home.component.ts | 20 ++++++++++++++++--- .../home/pages/admin/admin-routing.module.ts | 3 +++ .../notification-routing.module.ts | 1 + .../widget/widget-library-routing.module.ts | 1 + 7 files changed, 30 insertions(+), 6 deletions(-) diff --git a/ui-ngx/src/app/modules/home/components/vc/repository-settings.component.html b/ui-ngx/src/app/modules/home/components/vc/repository-settings.component.html index 10fae28b6d..e0d33fdfd5 100644 --- a/ui-ngx/src/app/modules/home/components/vc/repository-settings.component.html +++ b/ui-ngx/src/app/modules/home/components/vc/repository-settings.component.html @@ -26,7 +26,7 @@
- +
diff --git a/ui-ngx/src/app/modules/home/components/vc/repository-settings.component.ts b/ui-ngx/src/app/modules/home/components/vc/repository-settings.component.ts index e65658ea53..b2af171353 100644 --- a/ui-ngx/src/app/modules/home/components/vc/repository-settings.component.ts +++ b/ui-ngx/src/app/modules/home/components/vc/repository-settings.component.ts @@ -48,6 +48,9 @@ export class RepositorySettingsComponent extends PageComponent implements OnInit @Input() popoverComponent: TbPopoverComponent; + @Input() + hideLoadingBar = false; + repositorySettingsForm: UntypedFormGroup; settings: RepositorySettings = null; diff --git a/ui-ngx/src/app/modules/home/components/vc/version-control.component.html b/ui-ngx/src/app/modules/home/components/vc/version-control.component.html index 4495ce5c5e..566c1b149f 100644 --- a/ui-ngx/src/app/modules/home/components/vc/version-control.component.html +++ b/ui-ngx/src/app/modules/home/components/vc/version-control.component.html @@ -15,9 +15,11 @@ limitations under the License. --> - + *ngIf="!(hasRepository$ | async); else versionsTable"> , @Inject(WINDOW) private window: Window, private activeComponentService: ActiveComponentService, - public breakpointObserver: BreakpointObserver, - private fb: FormBuilder) { + private fb: FormBuilder, + private route: ActivatedRoute, + public breakpointObserver: BreakpointObserver) { super(store); } @@ -144,9 +147,20 @@ export class HomeComponent extends PageComponent implements AfterViewInit, OnIni private updateActiveComponent(activeComponent: any) { this.showSearch = false; + this.hideLoadingBar = false; this.textSearch.reset('', {emitEvent: false}); this.activeComponent = activeComponent; - this.hideLoadingBar = activeComponent && activeComponent instanceof RouterTabsComponent; + let showLoadingBar: boolean; + if (isDefined(this.route.children[0]?.snapshot?.data?.showLoadingBar)) { + showLoadingBar = this.route.children[0]?.snapshot?.data?.showLoadingBar; + } else if (isDefined(this.route.children[0]?.children[0]?.snapshot?.data?.showLoadingBar)) { + showLoadingBar = this.route.children[0]?.children[0]?.snapshot?.data?.showLoadingBar; + } + if (activeComponent && activeComponent instanceof RouterTabsComponent) { + this.hideLoadingBar = isDefinedAndNotNull(showLoadingBar) ? !showLoadingBar : true; + } else if (isDefinedAndNotNull(showLoadingBar)) { + this.hideLoadingBar = !showLoadingBar; + } if (this.activeComponent && instanceOfSearchableComponent(this.activeComponent)) { this.searchEnabled = true; this.searchableComponent = this.activeComponent; diff --git a/ui-ngx/src/app/modules/home/pages/admin/admin-routing.module.ts b/ui-ngx/src/app/modules/home/pages/admin/admin-routing.module.ts index 74c5012791..c91448c7d7 100644 --- a/ui-ngx/src/app/modules/home/pages/admin/admin-routing.module.ts +++ b/ui-ngx/src/app/modules/home/pages/admin/admin-routing.module.ts @@ -323,6 +323,7 @@ const routes: Routes = [ canDeactivate: [ConfirmOnExitGuard], data: { auth: [Authority.SYS_ADMIN], + showLoadingBar: false, title: 'admin.general', breadcrumb: { label: 'admin.general', @@ -336,6 +337,7 @@ const routes: Routes = [ canDeactivate: [ConfirmOnExitGuard], data: { auth: [Authority.SYS_ADMIN], + showLoadingBar: false, title: 'admin.2fa.2fa', breadcrumb: { label: 'admin.2fa.2fa', @@ -349,6 +351,7 @@ const routes: Routes = [ canDeactivate: [ConfirmOnExitGuard], data: { auth: [Authority.SYS_ADMIN], + showLoadingBar: false, title: 'admin.oauth2.oauth2', breadcrumb: { label: 'admin.oauth2.oauth2', diff --git a/ui-ngx/src/app/modules/home/pages/notification/notification-routing.module.ts b/ui-ngx/src/app/modules/home/pages/notification/notification-routing.module.ts index 41f49ee708..995bda9234 100644 --- a/ui-ngx/src/app/modules/home/pages/notification/notification-routing.module.ts +++ b/ui-ngx/src/app/modules/home/pages/notification/notification-routing.module.ts @@ -32,6 +32,7 @@ const routes: Routes = [ component: RouterTabsComponent, data: { auth: [Authority.TENANT_ADMIN, Authority.CUSTOMER_USER, Authority.SYS_ADMIN], + showLoadingBar: true, breadcrumb: { label: 'notification.notification-center', icon: 'mdi:message-badge' diff --git a/ui-ngx/src/app/modules/home/pages/widget/widget-library-routing.module.ts b/ui-ngx/src/app/modules/home/pages/widget/widget-library-routing.module.ts index c808bae163..160a0e18da 100644 --- a/ui-ngx/src/app/modules/home/pages/widget/widget-library-routing.module.ts +++ b/ui-ngx/src/app/modules/home/pages/widget/widget-library-routing.module.ts @@ -234,6 +234,7 @@ export const widgetsLibraryRoutes: Routes = [ component: RouterTabsComponent, data: { auth: [Authority.SYS_ADMIN, Authority.TENANT_ADMIN], + showLoadingBar: true, breadcrumb: { label: 'widget.widget-library', icon: 'now_widgets' From 2d6dba7772207e46dbcc6291eb468c430467aece Mon Sep 17 00:00:00 2001 From: Artem Dzhereleiko Date: Tue, 23 Jan 2024 15:27:53 +0200 Subject: [PATCH 2/5] UI: Refactoring --- .../vc/repository-settings.component.html | 2 +- .../vc/repository-settings.component.ts | 2 ++ .../vc/version-control.component.html | 2 +- ui-ngx/src/app/modules/home/home.component.ts | 10 +++++----- .../home/pages/admin/admin-routing.module.ts | 3 --- .../pages/admin/oauth2-settings.component.ts | 20 +++++++++++++++---- .../admin/security-settings.component.ts | 13 ++++++------ .../two-factor-auth-settings.component.ts | 5 ++++- .../modules/home/pages/home-pages.models.ts | 4 ++++ 9 files changed, 40 insertions(+), 21 deletions(-) diff --git a/ui-ngx/src/app/modules/home/components/vc/repository-settings.component.html b/ui-ngx/src/app/modules/home/components/vc/repository-settings.component.html index e0d33fdfd5..7ba277364d 100644 --- a/ui-ngx/src/app/modules/home/components/vc/repository-settings.component.html +++ b/ui-ngx/src/app/modules/home/components/vc/repository-settings.component.html @@ -28,7 +28,7 @@ -
+
diff --git a/ui-ngx/src/app/modules/home/components/vc/repository-settings.component.ts b/ui-ngx/src/app/modules/home/components/vc/repository-settings.component.ts index b2af171353..2cdef0dea4 100644 --- a/ui-ngx/src/app/modules/home/components/vc/repository-settings.component.ts +++ b/ui-ngx/src/app/modules/home/components/vc/repository-settings.component.ts @@ -34,6 +34,7 @@ import { selectHasRepository } from '@core/auth/auth.selectors'; import { catchError, mergeMap, take } from 'rxjs/operators'; import { of } from 'rxjs'; import { TbPopoverComponent } from '@shared/components/popover.component'; +import { coerceBoolean } from '@shared/decorators/coercion'; @Component({ selector: 'tb-repository-settings', @@ -49,6 +50,7 @@ export class RepositorySettingsComponent extends PageComponent implements OnInit popoverComponent: TbPopoverComponent; @Input() + @coerceBoolean() hideLoadingBar = false; repositorySettingsForm: UntypedFormGroup; diff --git a/ui-ngx/src/app/modules/home/components/vc/version-control.component.html b/ui-ngx/src/app/modules/home/components/vc/version-control.component.html index 566c1b149f..eb4b1d962b 100644 --- a/ui-ngx/src/app/modules/home/components/vc/version-control.component.html +++ b/ui-ngx/src/app/modules/home/components/vc/version-control.component.html @@ -17,7 +17,7 @@ --> diff --git a/ui-ngx/src/app/modules/home/home.component.ts b/ui-ngx/src/app/modules/home/home.component.ts index 3042061bb5..f88cdc9dec 100644 --- a/ui-ngx/src/app/modules/home/home.component.ts +++ b/ui-ngx/src/app/modules/home/home.component.ts @@ -15,7 +15,7 @@ /// import { AfterViewInit, Component, ElementRef, Inject, OnDestroy, OnInit, ViewChild } from '@angular/core'; -import { startWith, skip, Subject } from 'rxjs'; +import { skip, startWith, Subject } from 'rxjs'; import { Store } from '@ngrx/store'; import { debounceTime, distinctUntilChanged, takeUntil } from 'rxjs/operators'; @@ -151,10 +151,10 @@ export class HomeComponent extends PageComponent implements AfterViewInit, OnIni this.textSearch.reset('', {emitEvent: false}); this.activeComponent = activeComponent; let showLoadingBar: boolean; - if (isDefined(this.route.children[0]?.snapshot?.data?.showLoadingBar)) { - showLoadingBar = this.route.children[0]?.snapshot?.data?.showLoadingBar; - } else if (isDefined(this.route.children[0]?.children[0]?.snapshot?.data?.showLoadingBar)) { - showLoadingBar = this.route.children[0]?.children[0]?.snapshot?.data?.showLoadingBar; + if (isDefined(this.activeComponent.activatedRoute?.data?.value?.showLoadingBar)) { + showLoadingBar = this.activeComponent.activatedRoute?.data?.value?.showLoadingBar; + } else if (isDefined(this.activeComponent?.showLoadingBar)) { + showLoadingBar = this.activeComponent.showLoadingBar; } if (activeComponent && activeComponent instanceof RouterTabsComponent) { this.hideLoadingBar = isDefinedAndNotNull(showLoadingBar) ? !showLoadingBar : true; diff --git a/ui-ngx/src/app/modules/home/pages/admin/admin-routing.module.ts b/ui-ngx/src/app/modules/home/pages/admin/admin-routing.module.ts index c91448c7d7..74c5012791 100644 --- a/ui-ngx/src/app/modules/home/pages/admin/admin-routing.module.ts +++ b/ui-ngx/src/app/modules/home/pages/admin/admin-routing.module.ts @@ -323,7 +323,6 @@ const routes: Routes = [ canDeactivate: [ConfirmOnExitGuard], data: { auth: [Authority.SYS_ADMIN], - showLoadingBar: false, title: 'admin.general', breadcrumb: { label: 'admin.general', @@ -337,7 +336,6 @@ const routes: Routes = [ canDeactivate: [ConfirmOnExitGuard], data: { auth: [Authority.SYS_ADMIN], - showLoadingBar: false, title: 'admin.2fa.2fa', breadcrumb: { label: 'admin.2fa.2fa', @@ -351,7 +349,6 @@ const routes: Routes = [ canDeactivate: [ConfirmOnExitGuard], data: { auth: [Authority.SYS_ADMIN], - showLoadingBar: false, title: 'admin.oauth2.oauth2', breadcrumb: { label: 'admin.oauth2.oauth2', diff --git a/ui-ngx/src/app/modules/home/pages/admin/oauth2-settings.component.ts b/ui-ngx/src/app/modules/home/pages/admin/oauth2-settings.component.ts index 4b0ba741d3..798b07c461 100644 --- a/ui-ngx/src/app/modules/home/pages/admin/oauth2-settings.component.ts +++ b/ui-ngx/src/app/modules/home/pages/admin/oauth2-settings.component.ts @@ -15,7 +15,14 @@ /// import { Component, Inject, OnDestroy, OnInit } from '@angular/core'; -import { AbstractControl, UntypedFormArray, UntypedFormBuilder, UntypedFormGroup, ValidationErrors, Validators } from '@angular/forms'; +import { + AbstractControl, + UntypedFormArray, + UntypedFormBuilder, + UntypedFormGroup, + ValidationErrors, + Validators +} from '@angular/forms'; import { ClientAuthenticationMethod, DomainSchema, @@ -26,9 +33,11 @@ import { MapperConfigType, OAuth2ClientRegistrationTemplate, OAuth2DomainInfo, - OAuth2Info, OAuth2MobileInfo, + OAuth2Info, + OAuth2MobileInfo, OAuth2ParamsInfo, - OAuth2RegistrationInfo, PlatformType, + OAuth2RegistrationInfo, + PlatformType, platformTypeTranslations, TenantNameStrategy } from '@shared/models/oauth2.models'; @@ -45,13 +54,14 @@ import { TranslateService } from '@ngx-translate/core'; import { isDefined, isDefinedAndNotNull, randomAlphanumeric } from '@core/utils'; import { OAuth2Service } from '@core/http/oauth2.service'; import { ActivatedRoute } from '@angular/router'; +import { HasShowLoading } from '@home/pages/home-pages.models'; @Component({ selector: 'tb-oauth2-settings', templateUrl: './oauth2-settings.component.html', styleUrls: ['./oauth2-settings.component.scss', './settings-card.scss'] }) -export class OAuth2SettingsComponent extends PageComponent implements OnInit, HasConfirmForm, OnDestroy { +export class OAuth2SettingsComponent extends PageComponent implements OnInit, HasConfirmForm, HasShowLoading, OnDestroy { constructor(protected store: Store, private route: ActivatedRoute, @@ -105,6 +115,8 @@ export class OAuth2SettingsComponent extends PageComponent implements OnInit, Ha templateProvider = ['Custom']; + showLoadingBar = false; + private loginProcessingUrl: string = this.route.snapshot.data.loginProcessingUrl; private static validateScope(control: AbstractControl): ValidationErrors | null { diff --git a/ui-ngx/src/app/modules/home/pages/admin/security-settings.component.ts b/ui-ngx/src/app/modules/home/pages/admin/security-settings.component.ts index e4fd483eb9..f9449eba33 100644 --- a/ui-ngx/src/app/modules/home/pages/admin/security-settings.component.ts +++ b/ui-ngx/src/app/modules/home/pages/admin/security-settings.component.ts @@ -23,7 +23,8 @@ import { AbstractControl, UntypedFormBuilder, UntypedFormControl, - UntypedFormGroup, ValidationErrors, + UntypedFormGroup, + ValidationErrors, ValidatorFn, Validators } from '@angular/forms'; @@ -35,21 +36,21 @@ import { randomAlphanumeric } from '@core/utils'; import { AuthService } from '@core/auth/auth.service'; import { DialogService } from '@core/services/dialog.service'; import { TranslateService } from '@ngx-translate/core'; -import { forkJoin, Observable, of } from 'rxjs'; -import { MatCheckboxChange } from '@angular/material/checkbox'; -import { AlarmInfo } from '@shared/models/alarm.models'; -import { QueueProcessingStrategyTypes, QueueProcessingStrategyTypesMap } from '@shared/models/queue.models'; +import { Observable, of } from 'rxjs'; +import { HasShowLoading } from '@home/pages/home-pages.models'; @Component({ selector: 'tb-security-settings', templateUrl: './security-settings.component.html', styleUrls: ['./security-settings.component.scss', './settings-card.scss'] }) -export class SecuritySettingsComponent extends PageComponent implements HasConfirmForm { +export class SecuritySettingsComponent extends PageComponent implements HasConfirmForm, HasShowLoading { securitySettingsFormGroup: UntypedFormGroup; jwtSecuritySettingsFormGroup: UntypedFormGroup; + showLoadingBar = false; + private securitySettings: SecuritySettings; private jwtSettings: JwtSettings; diff --git a/ui-ngx/src/app/modules/home/pages/admin/two-factor-auth-settings.component.ts b/ui-ngx/src/app/modules/home/pages/admin/two-factor-auth-settings.component.ts index 5ea4776ff9..208d133e3e 100644 --- a/ui-ngx/src/app/modules/home/pages/admin/two-factor-auth-settings.component.ts +++ b/ui-ngx/src/app/modules/home/pages/admin/two-factor-auth-settings.component.ts @@ -32,13 +32,14 @@ import { isNotEmptyStr } from '@core/utils'; import { Subject } from 'rxjs'; import { takeUntil } from 'rxjs/operators'; import { MatExpansionPanel } from '@angular/material/expansion'; +import { HasShowLoading } from '@home/pages/home-pages.models'; @Component({ selector: 'tb-2fa-settings', templateUrl: './two-factor-auth-settings.component.html', styleUrls: [ './settings-card.scss', './two-factor-auth-settings.component.scss'] }) -export class TwoFactorAuthSettingsComponent extends PageComponent implements OnInit, HasConfirmForm, OnDestroy { +export class TwoFactorAuthSettingsComponent extends PageComponent implements OnInit, HasConfirmForm, HasShowLoading, OnDestroy { private readonly destroy$ = new Subject(); private readonly posIntValidation = [Validators.required, Validators.min(1), Validators.pattern(/^\d*$/)]; @@ -47,6 +48,8 @@ export class TwoFactorAuthSettingsComponent extends PageComponent implements OnI twoFactorAuthProviderType = TwoFactorAuthProviderType; twoFactorAuthProvidersData = twoFactorAuthProvidersData; + showLoadingBar = false; + @ViewChildren(MatExpansionPanel) expansionPanel: QueryList; constructor(protected store: Store, diff --git a/ui-ngx/src/app/modules/home/pages/home-pages.models.ts b/ui-ngx/src/app/modules/home/pages/home-pages.models.ts index 20872e3c65..456bbb6999 100644 --- a/ui-ngx/src/app/modules/home/pages/home-pages.models.ts +++ b/ui-ngx/src/app/modules/home/pages/home-pages.models.ts @@ -31,3 +31,7 @@ export const entityDetailsPageBreadcrumbLabelFunction: BreadCrumbLabelFunction Date: Tue, 23 Jan 2024 15:41:02 +0200 Subject: [PATCH 3/5] UI: Remove route --- ui-ngx/src/app/modules/home/home.component.ts | 1 - 1 file changed, 1 deletion(-) diff --git a/ui-ngx/src/app/modules/home/home.component.ts b/ui-ngx/src/app/modules/home/home.component.ts index f88cdc9dec..a314803e9c 100644 --- a/ui-ngx/src/app/modules/home/home.component.ts +++ b/ui-ngx/src/app/modules/home/home.component.ts @@ -73,7 +73,6 @@ export class HomeComponent extends PageComponent implements AfterViewInit, OnIni @Inject(WINDOW) private window: Window, private activeComponentService: ActiveComponentService, private fb: FormBuilder, - private route: ActivatedRoute, public breakpointObserver: BreakpointObserver) { super(store); } From 567e6a493ee265d42e252abd0905f97e21a9f6dd Mon Sep 17 00:00:00 2001 From: Artem Dzhereleiko Date: Mon, 5 Feb 2024 12:57:22 +0200 Subject: [PATCH 4/5] UI: Refactoring after review --- .../components/vc/repository-settings.component.html | 2 +- ui-ngx/src/app/modules/home/home.component.ts | 10 +++++----- .../home/pages/account/account-routing.module.ts | 1 + .../modules/home/pages/admin/admin-routing.module.ts | 1 + .../home/pages/admin/oauth2-settings.component.ts | 5 ++--- .../home/pages/admin/security-settings.component.ts | 5 ++--- .../pages/admin/two-factor-auth-settings.component.ts | 5 ++--- ui-ngx/src/app/modules/home/pages/home-pages.models.ts | 4 ++-- .../pages/notification/notification-routing.module.ts | 1 - .../home/pages/widget/widget-library-routing.module.ts | 1 - ui-ngx/src/app/shared/components/page.component.ts | 5 ++++- 11 files changed, 20 insertions(+), 20 deletions(-) diff --git a/ui-ngx/src/app/modules/home/components/vc/repository-settings.component.html b/ui-ngx/src/app/modules/home/components/vc/repository-settings.component.html index 7ba277364d..9b1c627ff2 100644 --- a/ui-ngx/src/app/modules/home/components/vc/repository-settings.component.html +++ b/ui-ngx/src/app/modules/home/components/vc/repository-settings.component.html @@ -28,7 +28,7 @@ -
+
diff --git a/ui-ngx/src/app/modules/home/home.component.ts b/ui-ngx/src/app/modules/home/home.component.ts index a314803e9c..0b41a90ae3 100644 --- a/ui-ngx/src/app/modules/home/home.component.ts +++ b/ui-ngx/src/app/modules/home/home.component.ts @@ -150,14 +150,14 @@ export class HomeComponent extends PageComponent implements AfterViewInit, OnIni this.textSearch.reset('', {emitEvent: false}); this.activeComponent = activeComponent; let showLoadingBar: boolean; - if (isDefined(this.activeComponent.activatedRoute?.data?.value?.showLoadingBar)) { - showLoadingBar = this.activeComponent.activatedRoute?.data?.value?.showLoadingBar; - } else if (isDefined(this.activeComponent?.showLoadingBar)) { - showLoadingBar = this.activeComponent.showLoadingBar; + if (isDefined(this.activeComponent.activatedRoute?.snapshot?.data?.showMainLoadingBar)) { + showLoadingBar = this.activeComponent.activatedRoute.snapshot.data.showMainLoadingBar; + } else if (isDefined(this.activeComponent?.showMainLoadingBar)) { + showLoadingBar = this.activeComponent.showMainLoadingBar; } if (activeComponent && activeComponent instanceof RouterTabsComponent) { this.hideLoadingBar = isDefinedAndNotNull(showLoadingBar) ? !showLoadingBar : true; - } else if (isDefinedAndNotNull(showLoadingBar)) { + } else if (activeComponent && activeComponent instanceof PageComponent && isDefinedAndNotNull(showLoadingBar)) { this.hideLoadingBar = !showLoadingBar; } if (this.activeComponent && instanceOfSearchableComponent(this.activeComponent)) { diff --git a/ui-ngx/src/app/modules/home/pages/account/account-routing.module.ts b/ui-ngx/src/app/modules/home/pages/account/account-routing.module.ts index 252250ece2..20e6cc73e1 100644 --- a/ui-ngx/src/app/modules/home/pages/account/account-routing.module.ts +++ b/ui-ngx/src/app/modules/home/pages/account/account-routing.module.ts @@ -33,6 +33,7 @@ const routes: Routes = [ component: RouterTabsComponent, data: { auth: [Authority.SYS_ADMIN, Authority.TENANT_ADMIN, Authority.CUSTOMER_USER], + showMainLoadingBar: false, breadcrumb: { label: 'account.account', icon: 'account_circle' diff --git a/ui-ngx/src/app/modules/home/pages/admin/admin-routing.module.ts b/ui-ngx/src/app/modules/home/pages/admin/admin-routing.module.ts index 74c5012791..63fb9a14de 100644 --- a/ui-ngx/src/app/modules/home/pages/admin/admin-routing.module.ts +++ b/ui-ngx/src/app/modules/home/pages/admin/admin-routing.module.ts @@ -136,6 +136,7 @@ const routes: Routes = [ component: RouterTabsComponent, data: { auth: [Authority.SYS_ADMIN, Authority.TENANT_ADMIN], + showMainLoadingBar: false, breadcrumb: { label: 'admin.settings', icon: 'settings' diff --git a/ui-ngx/src/app/modules/home/pages/admin/oauth2-settings.component.ts b/ui-ngx/src/app/modules/home/pages/admin/oauth2-settings.component.ts index 798b07c461..1d346c70f1 100644 --- a/ui-ngx/src/app/modules/home/pages/admin/oauth2-settings.component.ts +++ b/ui-ngx/src/app/modules/home/pages/admin/oauth2-settings.component.ts @@ -54,14 +54,13 @@ import { TranslateService } from '@ngx-translate/core'; import { isDefined, isDefinedAndNotNull, randomAlphanumeric } from '@core/utils'; import { OAuth2Service } from '@core/http/oauth2.service'; import { ActivatedRoute } from '@angular/router'; -import { HasShowLoading } from '@home/pages/home-pages.models'; @Component({ selector: 'tb-oauth2-settings', templateUrl: './oauth2-settings.component.html', styleUrls: ['./oauth2-settings.component.scss', './settings-card.scss'] }) -export class OAuth2SettingsComponent extends PageComponent implements OnInit, HasConfirmForm, HasShowLoading, OnDestroy { +export class OAuth2SettingsComponent extends PageComponent implements OnInit, HasConfirmForm, OnDestroy { constructor(protected store: Store, private route: ActivatedRoute, @@ -115,7 +114,7 @@ export class OAuth2SettingsComponent extends PageComponent implements OnInit, Ha templateProvider = ['Custom']; - showLoadingBar = false; + showMainLoadingBar = false; private loginProcessingUrl: string = this.route.snapshot.data.loginProcessingUrl; diff --git a/ui-ngx/src/app/modules/home/pages/admin/security-settings.component.ts b/ui-ngx/src/app/modules/home/pages/admin/security-settings.component.ts index f9449eba33..17dda4a0c9 100644 --- a/ui-ngx/src/app/modules/home/pages/admin/security-settings.component.ts +++ b/ui-ngx/src/app/modules/home/pages/admin/security-settings.component.ts @@ -37,19 +37,18 @@ import { AuthService } from '@core/auth/auth.service'; import { DialogService } from '@core/services/dialog.service'; import { TranslateService } from '@ngx-translate/core'; import { Observable, of } from 'rxjs'; -import { HasShowLoading } from '@home/pages/home-pages.models'; @Component({ selector: 'tb-security-settings', templateUrl: './security-settings.component.html', styleUrls: ['./security-settings.component.scss', './settings-card.scss'] }) -export class SecuritySettingsComponent extends PageComponent implements HasConfirmForm, HasShowLoading { +export class SecuritySettingsComponent extends PageComponent implements HasConfirmForm { securitySettingsFormGroup: UntypedFormGroup; jwtSecuritySettingsFormGroup: UntypedFormGroup; - showLoadingBar = false; + showMainLoadingBar = false; private securitySettings: SecuritySettings; private jwtSettings: JwtSettings; diff --git a/ui-ngx/src/app/modules/home/pages/admin/two-factor-auth-settings.component.ts b/ui-ngx/src/app/modules/home/pages/admin/two-factor-auth-settings.component.ts index 208d133e3e..5355114586 100644 --- a/ui-ngx/src/app/modules/home/pages/admin/two-factor-auth-settings.component.ts +++ b/ui-ngx/src/app/modules/home/pages/admin/two-factor-auth-settings.component.ts @@ -32,14 +32,13 @@ import { isNotEmptyStr } from '@core/utils'; import { Subject } from 'rxjs'; import { takeUntil } from 'rxjs/operators'; import { MatExpansionPanel } from '@angular/material/expansion'; -import { HasShowLoading } from '@home/pages/home-pages.models'; @Component({ selector: 'tb-2fa-settings', templateUrl: './two-factor-auth-settings.component.html', styleUrls: [ './settings-card.scss', './two-factor-auth-settings.component.scss'] }) -export class TwoFactorAuthSettingsComponent extends PageComponent implements OnInit, HasConfirmForm, HasShowLoading, OnDestroy { +export class TwoFactorAuthSettingsComponent extends PageComponent implements OnInit, HasConfirmForm, OnDestroy { private readonly destroy$ = new Subject(); private readonly posIntValidation = [Validators.required, Validators.min(1), Validators.pattern(/^\d*$/)]; @@ -48,7 +47,7 @@ export class TwoFactorAuthSettingsComponent extends PageComponent implements OnI twoFactorAuthProviderType = TwoFactorAuthProviderType; twoFactorAuthProvidersData = twoFactorAuthProvidersData; - showLoadingBar = false; + showMainLoadingBar = false; @ViewChildren(MatExpansionPanel) expansionPanel: QueryList; diff --git a/ui-ngx/src/app/modules/home/pages/home-pages.models.ts b/ui-ngx/src/app/modules/home/pages/home-pages.models.ts index 456bbb6999..d2b7e9782c 100644 --- a/ui-ngx/src/app/modules/home/pages/home-pages.models.ts +++ b/ui-ngx/src/app/modules/home/pages/home-pages.models.ts @@ -31,7 +31,7 @@ export const entityDetailsPageBreadcrumbLabelFunction: BreadCrumbLabelFunction; loadingSubscription: Subscription; disabledOnLoadFormControls: Array = []; + showMainLoadingBar = true; + protected constructor(protected store: Store) { this.isLoading$ = this.store.pipe(delay(0), select(selectIsLoading), share()); } From c17b2d3b487f66c2ce7b31e9d9a7542e91495300 Mon Sep 17 00:00:00 2001 From: Artem Dzhereleiko Date: Tue, 6 Feb 2024 11:23:00 +0200 Subject: [PATCH 5/5] UI: Refactoring --- .../vc/repository-settings.component.html | 2 +- ui-ngx/src/app/modules/home/home.component.ts | 18 ++++++++---------- .../modules/home/pages/home-pages.models.ts | 5 ----- .../app/shared/components/page.component.ts | 3 +-- 4 files changed, 10 insertions(+), 18 deletions(-) diff --git a/ui-ngx/src/app/modules/home/components/vc/repository-settings.component.html b/ui-ngx/src/app/modules/home/components/vc/repository-settings.component.html index 9b1c627ff2..2fda773889 100644 --- a/ui-ngx/src/app/modules/home/components/vc/repository-settings.component.html +++ b/ui-ngx/src/app/modules/home/components/vc/repository-settings.component.html @@ -28,7 +28,7 @@ -
+
diff --git a/ui-ngx/src/app/modules/home/home.component.ts b/ui-ngx/src/app/modules/home/home.component.ts index 0b41a90ae3..d6c07004c0 100644 --- a/ui-ngx/src/app/modules/home/home.component.ts +++ b/ui-ngx/src/app/modules/home/home.component.ts @@ -149,17 +149,15 @@ export class HomeComponent extends PageComponent implements AfterViewInit, OnIni this.hideLoadingBar = false; this.textSearch.reset('', {emitEvent: false}); this.activeComponent = activeComponent; - let showLoadingBar: boolean; - if (isDefined(this.activeComponent.activatedRoute?.snapshot?.data?.showMainLoadingBar)) { - showLoadingBar = this.activeComponent.activatedRoute.snapshot.data.showMainLoadingBar; - } else if (isDefined(this.activeComponent?.showMainLoadingBar)) { - showLoadingBar = this.activeComponent.showMainLoadingBar; - } - if (activeComponent && activeComponent instanceof RouterTabsComponent) { - this.hideLoadingBar = isDefinedAndNotNull(showLoadingBar) ? !showLoadingBar : true; - } else if (activeComponent && activeComponent instanceof PageComponent && isDefinedAndNotNull(showLoadingBar)) { - this.hideLoadingBar = !showLoadingBar; + + if (activeComponent && activeComponent instanceof RouterTabsComponent + && isDefinedAndNotNull(this.activeComponent.activatedRoute?.snapshot?.data?.showMainLoadingBar)) { + this.hideLoadingBar = !this.activeComponent.activatedRoute.snapshot.data.showMainLoadingBar; + } else if (activeComponent && activeComponent instanceof PageComponent + && isDefinedAndNotNull(this.activeComponent?.showMainLoadingBar)) { + this.hideLoadingBar = !this.activeComponent.showMainLoadingBar; } + if (this.activeComponent && instanceOfSearchableComponent(this.activeComponent)) { this.searchEnabled = true; this.searchableComponent = this.activeComponent; diff --git a/ui-ngx/src/app/modules/home/pages/home-pages.models.ts b/ui-ngx/src/app/modules/home/pages/home-pages.models.ts index d2b7e9782c..848bb0b85c 100644 --- a/ui-ngx/src/app/modules/home/pages/home-pages.models.ts +++ b/ui-ngx/src/app/modules/home/pages/home-pages.models.ts @@ -30,8 +30,3 @@ export const entityDetailsPageBreadcrumbLabelFunction: BreadCrumbLabelFunction; loadingSubscription: Subscription;