Fixed issue with feature-toggling. Also implemented spinner when organization is changed.

This commit is contained in:
Erik Tiekstra
2021-09-13 07:11:51 +02:00
parent ab39f5a82a
commit 51d42b1669
9 changed files with 154 additions and 131 deletions

View File

@@ -1,5 +1,5 @@
import { CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
import { ComponentFixture, TestBed } from '@angular/core/testing';
import { ErrorListComponent } from './error-list.component';
describe('ErrorListComponent', () => {
@@ -8,9 +8,9 @@ describe('ErrorListComponent', () => {
beforeEach(async () => {
await TestBed.configureTestingModule({
declarations: [ ErrorListComponent ]
})
.compileComponents();
schemas: [CUSTOM_ELEMENTS_SCHEMA],
declarations: [ErrorListComponent],
}).compileComponents();
});
beforeEach(() => {

View File

@@ -1,10 +1,11 @@
import { CommonModule } from '@angular/common';
import { NgModule } from '@angular/core';
import { CUSTOM_ELEMENTS_SCHEMA, NgModule } from '@angular/core';
import { RouterModule } from '@angular/router';
import { IconModule } from '@msfa-shared/components/icon/icon.module';
import { SidebarComponent } from './sidebar.component';
@NgModule({
schemas: [CUSTOM_ELEMENTS_SCHEMA],
declarations: [SidebarComponent],
imports: [CommonModule, RouterModule, IconModule],
exports: [SidebarComponent],

View File

@@ -18,3 +18,10 @@
<msfa-footer class="msfa__footer"></msfa-footer>
</div>
<div
*ngIf="(userLoading$ | async) || (rolesLoading$ | async)"
class="msfa__loading-wrapper msfa__loading-wrapper--full-screen"
>
<digi-icon-spinner class="msfa__spinner"></digi-icon-spinner>
</div>

View File

@@ -28,7 +28,9 @@ export class LayoutComponent extends UnsubscribeDirective {
isLoggedIn$: Observable<boolean> = this.authenticationService.isLoggedIn$;
selectedOrganization$: Observable<Organization> = this.userService.selectedOrganization$;
user$: Observable<Employee> = this.userService.user$.pipe(filter(user => !!user));
roles$: Observable<Role[]> = this.userService.userRoles$.pipe(filter(roles => !!roles?.length));
roles$: Observable<Role[]> = this.userService.userRoles$.pipe(filter(roles => !!roles));
userLoading$: Observable<boolean> = this.userService.userLoading$;
rolesLoading$: Observable<boolean> = this.userService.userRolesLoading$;
get breadcrumbsItems(): NavigationBreadcrumbsItem[] {
return this._breadcrumbsItems$.getValue();

View File

@@ -1,7 +1,7 @@
import { DigiNgNavigationBreadcrumbsModule } from '@af/digi-ng/_navigation/navigation-breadcrumbs';
import { CommonModule } from '@angular/common';
import { HttpClient } from '@angular/common/http';
import { NgModule } from '@angular/core';
import { CUSTOM_ELEMENTS_SCHEMA, NgModule } from '@angular/core';
import { RouterModule } from '@angular/router';
import { MarkdownModule } from 'ngx-markdown';
import { FooterModule } from './components/footer/footer.module';
@@ -11,6 +11,7 @@ import { SkipToContentModule } from './components/skip-to-content/skip-to-conten
import { LayoutComponent } from './layout.component';
@NgModule({
schemas: [CUSTOM_ELEMENTS_SCHEMA],
declarations: [LayoutComponent],
imports: [
CommonModule,

View File

@@ -11,7 +11,7 @@ import { mapResponseToOrganization, Organization } from '@msfa-models/organizati
import { Role } from '@msfa-models/role.model';
import { mapResponseToUserInfo, UserInfo } from '@msfa-models/user-info.model';
import { BehaviorSubject, combineLatest, Observable } from 'rxjs';
import { filter, map, switchMap } from 'rxjs/operators';
import { filter, map, switchMap, tap } from 'rxjs/operators';
import { AuthenticationService } from './authentication.service';
@Injectable({
@@ -26,6 +26,10 @@ export class UserService extends UnsubscribeDirective {
public organizations$: Observable<Organization[]> = this._organizations$.asObservable();
private _user$ = new BehaviorSubject<Employee>(null);
public user$: Observable<Employee> = this._user$.asObservable();
private _userRolesLoading$ = new BehaviorSubject<boolean>(false);
public userRolesLoading$: Observable<boolean> = this._userRolesLoading$.asObservable();
private _userLoading$ = new BehaviorSubject<boolean>(false);
public userLoading$: Observable<boolean> = this._userLoading$.asObservable();
private _userRoles$ = new BehaviorSubject<Role[]>(null);
public userRoles$: Observable<Role[]> = this._userRoles$.asObservable();
private _selectedOrganizationNumber$ = new BehaviorSubject<string>(null);
@@ -45,11 +49,17 @@ export class UserService extends UnsubscribeDirective {
combineLatest([this._isLoggedIn$, this.selectedOrganization$])
.pipe(
filter(([loggedIn, selectedOrganization]) => !!(loggedIn && selectedOrganization)),
tap(() => {
this._userLoading$.next(true);
this._userRolesLoading$.next(true);
}),
switchMap(() => combineLatest([this._fetchUserInfo$(), this._fetchCurrentUser$()]))
)
.subscribe(([userInfo, currentUser]) => {
this._userRoles$.next(userInfo.roles);
this._user$.next(currentUser);
this._userLoading$.next(false);
this._userRolesLoading$.next(false);
})
);
}