Merge pull request #10036 from ArtemDzhereleiko/AD/bug-fix/hide-progress-bar

Fixed progress bar

ui-ngx/src/app/modules/home/components/vc/repository-settings.component.html

@@ -26,9 +26,9 @@
       <span fxFlex></span>
       <div tb-help="repositorySettings"></div>
     </mat-card-header>
-    <mat-progress-bar color="warn" mode="indeterminate" *ngIf="isLoading$ | async">
+    <mat-progress-bar color="warn" mode="indeterminate" *ngIf="!hideLoadingBar && isLoading$ | async">
     </mat-progress-bar>
-    <div style="height: 4px;" *ngIf="!(isLoading$ | async)"></div>
+    <div style="height: 4px;" *ngIf="hideLoadingBar || !(isLoading$ | async)"></div>
     <mat-card-content style="padding-top: 16px;">
       <form [formGroup]="repositorySettingsForm" #formDirective="ngForm" (ngSubmit)="save()">
         <fieldset [disabled]="isLoading$ | async">

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',
@@ -48,6 +49,10 @@ export class RepositorySettingsComponent extends PageComponent implements OnInit
   @Input()
   popoverComponent: TbPopoverComponent;
 
+  @Input()
+  @coerceBoolean()
+  hideLoadingBar = false;
+
   repositorySettingsForm: UntypedFormGroup;
   settings: RepositorySettings = null;
 

ui-ngx/src/app/modules/home/components/vc/version-control.component.html

@@ -15,9 +15,11 @@
     limitations under the License.
 
 -->
-<tb-repository-settings #repositorySettingsComponent [detailsMode]="detailsMode"
+<tb-repository-settings #repositorySettingsComponent
+                        [detailsMode]="detailsMode"
+                        hideLoadingBar
                         [popoverComponent]="popoverComponent"
-  *ngIf="!(hasRepository$ | async); else versionsTable">
+                        *ngIf="!(hasRepository$ | async); else versionsTable">
 </tb-repository-settings>
 <ng-template #versionsTable>
   <tb-entity-versions-table [singleEntityMode]="singleEntityMode"

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';
 
@@ -32,6 +32,8 @@ import { instanceOfSearchableComponent, ISearchableComponent } from '@home/model
 import { ActiveComponentService } from '@core/services/active-component.service';
 import { RouterTabsComponent } from '@home/components/router-tabs.component';
 import { FormBuilder } from '@angular/forms';
+import { ActivatedRoute } from '@angular/router';
+import { isDefined, isDefinedAndNotNull } from '@core/utils';
 
 @Component({
   selector: 'tb-home',
@@ -70,8 +72,8 @@ export class HomeComponent extends PageComponent implements AfterViewInit, OnIni
   constructor(protected store: Store<AppState>,
               @Inject(WINDOW) private window: Window,
               private activeComponentService: ActiveComponentService,
-              public breakpointObserver: BreakpointObserver,
-              private fb: FormBuilder) {
+              private fb: FormBuilder,
+              public breakpointObserver: BreakpointObserver) {
     super(store);
   }
 
@@ -144,9 +146,18 @@ 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;
+
+    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;

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'

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'

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';
@@ -105,6 +114,8 @@ export class OAuth2SettingsComponent extends PageComponent implements OnInit, Ha
 
   templateProvider = ['Custom'];
 
+  showMainLoadingBar = false;
+
   private loginProcessingUrl: string = this.route.snapshot.data.loginProcessingUrl;
 
   private static validateScope(control: AbstractControl): ValidationErrors | null {

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,10 +36,7 @@ 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';
 
 @Component({
   selector: 'tb-security-settings',
@@ -50,6 +48,8 @@ export class SecuritySettingsComponent extends PageComponent implements HasConfi
   securitySettingsFormGroup: UntypedFormGroup;
   jwtSecuritySettingsFormGroup: UntypedFormGroup;
 
+  showMainLoadingBar = false;
+
   private securitySettings: SecuritySettings;
   private jwtSettings: JwtSettings;
 

ui-ngx/src/app/modules/home/pages/admin/two-factor-auth-settings.component.ts

@@ -47,6 +47,8 @@ export class TwoFactorAuthSettingsComponent extends PageComponent implements OnI
   twoFactorAuthProviderType = TwoFactorAuthProviderType;
   twoFactorAuthProvidersData = twoFactorAuthProvidersData;
 
+  showMainLoadingBar = false;
+
   @ViewChildren(MatExpansionPanel) expansionPanel: QueryList<MatExpansionPanel>;
 
   constructor(protected store: Store<AppState>,

ui-ngx/src/app/modules/home/pages/home-pages.models.ts

@@ -30,4 +30,3 @@ export const entityDetailsPageBreadcrumbLabelFunction: BreadCrumbLabelFunction<E
       return component.entity?.name;
   }
 });
-

ui-ngx/src/app/shared/components/page.component.ts

@@ -29,6 +29,8 @@ export abstract class PageComponent implements OnDestroy {
   loadingSubscription: Subscription;
   disabledOnLoadFormControls: Array<AbstractControl> = [];
 
+  showMainLoadingBar = true;
+
   protected constructor(protected store: Store<AppState>) {
     this.isLoading$ = this.store.pipe(delay(0), select(selectIsLoading), share());
   }