chore: allow user management functionality only for user managers (#298)

intershop · Jul 1, 2020 · 056d466 · 056d466
1 parent f3ffec1
commit 056d466
Show file tree

Hide file tree

Showing 4 changed files with 54 additions and 63 deletions.
diff --git a/src/app/pages/account/account-navigation/account-navigation.component.html b/src/app/pages/account/account-navigation/account-navigation.component.html
@@ -1,18 +1,20 @@
 <ng-container *ngIf="!isMobileView; else mobileNavigation">
   <ul class="account-navigation list-unstyled" data-testing-id="myaccount-navigation">
     <ng-container *ngFor="let item of navigationItems | keyvalue: unsorted; let first = first">
-      <li
-        *ishFeature="item.value.feature || 'always'"
-        routerLinkActive="active"
-        [routerLinkActiveOptions]="{ exact: first }"
-      >
-        <a [routerLink]="item.key" [attr.data-testing-id]="item.value.dataTestingId">{{
-          item.value.localizationKey | translate
-        }}</a>
-      </li>
+      <ng-container *ishIsAuthorizedTo="item.value.permission || 'always'">
+        <li
+          *ishFeature="item.value.feature || 'always'"
+          routerLinkActive="active"
+          [routerLinkActiveOptions]="{ exact: first }"
+        >
+          <a [routerLink]="item.key" [attr.data-testing-id]="item.value.dataTestingId">{{
+            item.value.localizationKey | translate
+          }}</a>
+        </li>
+      </ng-container>
       <ul *ngIf="item.value.children" class="account-navigation list-unstyled">
         <ng-container *ngFor="let subItem of item.value.children | keyvalue: unsorted">
-          <li>
+          <li *ishIsAuthorizedTo="item.value.permission || 'always'">
             <a
               *ishFeature="subItem.value.feature || 'always'"
               [routerLink]="item.key + subItem.key"
@@ -29,13 +31,15 @@
 <ng-template #mobileNavigation>
   <select (change)="navigateTo($event.target.value)" class="form-control">
     <ng-container *ngFor="let item of navigationItems | keyvalue: unsorted">
-      <option
-        *ishFeature="item.value.feature || 'always'"
-        [value]="item.key"
-        [attr.selected]="item.value.link === currentPath ? 'selected' : undefined"
+      <ng-container *ishIsAuthorizedTo="item.value.permission || 'always'">
+        <option
+          *ishFeature="item.value.feature || 'always'"
+          [value]="item.key"
+          [attr.selected]="item.value.link === currentPath ? 'selected' : undefined"
+        >
+          {{ item.value.localizationKey | translate }}
+        </option></ng-container
       >
-        {{ item.value.localizationKey | translate }}
-      </option>
     </ng-container>
   </select>
 </ng-template>
diff --git a/src/app/pages/account/account-navigation/account-navigation.component.spec.ts b/src/app/pages/account/account-navigation/account-navigation.component.spec.ts
@@ -4,6 +4,7 @@ import { TranslateModule } from '@ngx-translate/core';
 import { of } from 'rxjs';
 import { instance, mock, when } from 'ts-mockito';
 
+import { AuthorizationToggleModule } from 'ish-core/authorization-toggle.module';
 import { AccountFacade } from 'ish-core/facades/account.facade';
 import { FeatureToggleModule } from 'ish-core/feature-toggle.module';
 
@@ -20,6 +21,7 @@ describe('Account Navigation Component', () => {
     TestBed.configureTestingModule({
       declarations: [AccountNavigationComponent],
       imports: [
+        AuthorizationToggleModule.forTesting('APP_B2B_MANAGE_USERS'),
         FeatureToggleModule.forTesting('quoting', 'orderTemplates'),
         RouterTestingModule,
         TranslateModule.forRoot(),

diff --git a/src/app/pages/account/account-navigation/account-navigation.component.ts b/src/app/pages/account/account-navigation/account-navigation.component.ts
@@ -1,17 +1,14 @@
-import { ChangeDetectionStrategy, Component, Input, OnChanges, OnDestroy, OnInit } from '@angular/core';
+import { ChangeDetectionStrategy, Component, Input, OnChanges, OnInit } from '@angular/core';
 import { Router } from '@angular/router';
-import { Subject } from 'rxjs';
-import { takeUntil } from 'rxjs/operators';
 
-import { AccountFacade } from 'ish-core/facades/account.facade';
 import { DeviceType } from 'ish-core/models/viewtype/viewtype.types';
 
 interface NavigationItems {
   [link: string]: {
     localizationKey: string;
     dataTestingId?: string;
     feature?: string;
-    children?: NavigationItems;
+    permission?: string;
   };
 }
 
@@ -20,65 +17,48 @@ interface NavigationItems {
   templateUrl: './account-navigation.component.html',
   changeDetection: ChangeDetectionStrategy.OnPush,
 })
-export class AccountNavigationComponent implements OnInit, OnChanges, OnDestroy {
+export class AccountNavigationComponent implements OnInit, OnChanges {
   @Input() deviceType: DeviceType;
 
   isMobileView = false;
-  isBusinessCustomer: boolean;
-  private destroy$ = new Subject();
 
   /**
    * Manages the Account Navigation items.
    */
-  navigationItems: NavigationItems;
+  navigationItems: NavigationItems = {
+    '/account': { localizationKey: 'account.my_account.link' },
+    '/account/orders': { localizationKey: 'account.order_history.link' },
+    '/account/wishlists': {
+      localizationKey: 'account.wishlists.link',
+      feature: 'wishlists',
+      dataTestingId: 'wishlists-link',
+    },
+    '/account/order-templates': {
+      localizationKey: 'account.ordertemplates.link',
+      feature: 'orderTemplates',
+      dataTestingId: 'order-templates-link',
+    },
+    '/account/payment': { localizationKey: 'account.payment.link', dataTestingId: 'payments-link' },
+    '/account/addresses': { localizationKey: 'account.saved_addresses.link', dataTestingId: 'addresses-link' },
+    '/account/profile': { localizationKey: 'account.profile.link' },
+    '/account/quotes': { localizationKey: 'account.navigation.quotes.link', feature: 'quoting' },
+    '/account/organization': {
+      localizationKey: 'account.organization.user_management',
+      permission: 'APP_B2B_MANAGE_USERS',
+    },
+    '/logout': { localizationKey: 'account.navigation.logout.link' },
+  };
 
-  constructor(private router: Router, private accountFacade: AccountFacade) {}
+  constructor(private router: Router) {}
 
   ngOnInit() {
     this.isMobileView = this.deviceType === 'tablet' || this.deviceType === 'mobile';
-    this.accountFacade.isBusinessCustomer$.pipe(takeUntil(this.destroy$)).subscribe(x => (this.isBusinessCustomer = x));
-    this.initNavigationItems();
   }
 
   ngOnChanges() {
     this.isMobileView = this.deviceType === 'tablet' || this.deviceType === 'mobile';
   }
 
-  ngOnDestroy() {
-    this.destroy$.next();
-    this.destroy$.complete();
-  }
-
-  initNavigationItems() {
-    this.navigationItems = {
-      '/account': { localizationKey: 'account.my_account.link' },
-      '/account/orders': { localizationKey: 'account.order_history.link' },
-      '/account/wishlists': {
-        localizationKey: 'account.wishlists.link',
-        feature: 'wishlists',
-        dataTestingId: 'wishlists-link',
-      },
-      '/account/order-templates': {
-        localizationKey: 'account.ordertemplates.link',
-        feature: 'orderTemplates',
-        dataTestingId: 'order-templates-link',
-      },
-      '/account/payment': { localizationKey: 'account.payment.link', dataTestingId: 'payments-link' },
-      '/account/addresses': { localizationKey: 'account.saved_addresses.link', dataTestingId: 'addresses-link' },
-      '/account/profile': { localizationKey: 'account.profile.link' },
-      '/account/quotes': { localizationKey: 'account.navigation.quotes.link', feature: 'quoting' },
-      /* TODO: organize as sub menu
-        '/account/organization': {
-        localizationKey: 'My Organization',
-        children: { '/users': { localizationKey: 'account.organization.user_management' } },
-      },*/
-      ...(this.isBusinessCustomer
-        ? { '/account/organization': { localizationKey: 'account.organization.user_management' } }
-        : {}),
-      '/logout': { localizationKey: 'account.navigation.logout.link' },
-    };
-  }
-
   get currentPath() {
     return location.pathname;
   }

diff --git a/src/app/pages/account/account-page.module.ts b/src/app/pages/account/account-page.module.ts
@@ -1,6 +1,7 @@
 import { NgModule } from '@angular/core';
 import { RouterModule, Routes } from '@angular/router';
 
+import { AuthorizationToggleGuard } from 'ish-core/authorization-toggle.module';
 import { SharedModule } from 'ish-shared/shared.module';
 
 import { AccountOverviewPageModule } from '../account-overview/account-overview-page.module';
@@ -70,6 +71,10 @@ const accountPageRoutes: Routes = [
           import('../../../../projects/organization-management/src/app/organization-management.module').then(
             m => m.OrganizationManagementModule
           ),
+        canActivate: [AuthorizationToggleGuard],
+        data: {
+          permission: 'APP_B2B_MANAGE_USERS',
+        },
       },
     ],
   },