Revised user management and permissions

src/app/admin/api-key/api-key-list/api-key-list.component.html

@@ -2,6 +2,7 @@
   [title]="'NAV.API-KEY' | translate"
   [ctaLabel]="'API-KEY.CREATE-NEW-API-KEY' | translate"
   [ctaRouterLink]="'new-api-key'"
+  [canEdit]="canEdit"
 >
 </app-top-bar>
 <div class="container-fluid">

src/app/admin/api-key/api-key-list/api-key-list.component.ts

@@ -2,6 +2,8 @@ import { Component, Input, OnInit } from '@angular/core';
 import { Title } from '@angular/platform-browser';
 import { TranslateService } from '@ngx-translate/core';
 import { SharedVariableService } from '@shared/shared-variable/shared-variable.service';
+import { MeService } from '@shared/services/me.service';
+import { OrganizationAccessScope } from '@shared/enums/access-scopes';
 
 @Component({
   selector: 'app-api-key-list',
@@ -10,11 +12,13 @@ import { SharedVariableService } from '@shared/shared-variable/shared-variable.s
 })
 export class ApiKeyListComponent implements OnInit {
   @Input() organisationId: number;
+  canEdit: boolean;
 
   constructor(
     public translate: TranslateService,
     private titleService: Title,
-    private globalService: SharedVariableService
+    private globalService: SharedVariableService,
+    private meService: MeService
   ) {
     translate.use('da');
   }
@@ -24,5 +28,6 @@ export class ApiKeyListComponent implements OnInit {
       this.titleService.setTitle(translations['TITLE.API-KEY']);
     });
     this.organisationId = this.globalService.getSelectedOrganisationId();
+    this.canEdit = this.meService.hasAccessToTargetOrganization(OrganizationAccessScope.UserAdministrationWrite, this.organisationId);
   }
 }

src/app/admin/api-key/api-key-list/api-key-table/api-key-table.component.ts

@@ -9,6 +9,7 @@ import { merge, Observable, of } from 'rxjs';
 import { catchError, map, startWith, switchMap } from 'rxjs/operators';
 import { ApiKeyGetManyResponse, ApiKeyResponse } from '../../api-key.model';
 import { ApiKeyService } from '../../api-key.service';
+import { OrganizationAccessScope } from '@shared/enums/access-scopes';
 
 @Component({
   selector: 'app-api-key-table',
@@ -81,7 +82,8 @@ export class ApiKeyTableComponent implements AfterViewInit {
   }
 
   canAccess(_element: ApiKeyResponse) {
-    return this.meService.hasAdminAccessInTargetOrganization(
+    return this.meService.hasAccessToTargetOrganization(
+      OrganizationAccessScope.UserAdministrationWrite,
       this.organisationId
     );
   }

src/app/admin/organisation/organisation-detail/organisation-detail.component.html

@@ -1,6 +1,13 @@
 <div [hidden]="!organisation" *ngIf="organisation">
-    <app-top-bar [data]="organisation" [backButton]="backButton" [subPage]="true" [addDetailDowndown]="true"
-        [dropDownButton]="dropdownButton" (deleteSelectedInDropdown)="clickDelete()">
+    <app-top-bar
+      [data]="organisation"
+      [backButton]="backButton"
+      [subPage]="true"
+      [addDetailDowndown]="true"
+      [dropDownButton]="dropdownButton"
+      (deleteSelectedInDropdown)="clickDelete()"
+      [canEdit]="canEdit"
+    >
     </app-top-bar>
     <div class="container-fluid">
         <div class="row">
@@ -34,4 +41,4 @@ <h3>
             </div>
         </div>
     </div>
-</div>
+</div>

src/app/admin/organisation/organisation-detail/organisation-detail.component.ts

@@ -15,6 +15,8 @@ import { DropdownButton } from '@shared/models/dropdown-button.model';
 import { ApplicationService } from '@applications/application.service';
 import { environment } from '@environments/environment';
 import { Title } from '@angular/platform-browser';
+import { MeService } from '@shared/services/me.service';
+import { OrganizationAccessScope } from '@shared/enums/access-scopes';
 
 @Component({
   selector: 'app-organisation-detail',
@@ -41,6 +43,7 @@ export class OrganisationDetailComponent implements OnInit, OnChanges, OnDestroy
   id: number;
   subscription: Subscription;
   permissions: PermissionResponse[];
+  canEdit: boolean;
 
   constructor(
     public translate: TranslateService,
@@ -49,7 +52,8 @@ export class OrganisationDetailComponent implements OnInit, OnChanges, OnDestroy
     private permissionsService: PermissionService,
     private deleteDialogService: DeleteDialogService,
     private location: Location,
-    private titleService: Title
+    private titleService: Title,
+    private meService: MeService
   ) { }
 
   ngOnChanges(changes: SimpleChanges): void {
@@ -71,8 +75,10 @@ export class OrganisationDetailComponent implements OnInit, OnChanges, OnDestroy
       .subscribe(translations => {
         this.backButton.label = translations['NAV.ORGANISATIONS'];
         this.dropdownButton.label = translations['ORGANISATION.DROPDOWN'];
-        this.titleService.setTitle(translations['TITLE.ORGANIZATION'])
+        this.titleService.setTitle(translations['TITLE.ORGANIZATION']);
       });
+
+    this.canEdit = this.meService.hasAccessToTargetOrganization(OrganizationAccessScope.UserAdministrationWrite);
   }
 
   ngOnDestroy() {
@@ -119,6 +125,6 @@ export class OrganisationDetailComponent implements OnInit, OnChanges, OnDestroy
           }
         });
       }
-    })
+    });
   }
 }

src/app/admin/organisation/organisation-list/organisation-list.component.html

@@ -1,5 +1,5 @@
 <app-top-bar [title]="'NAV.ORGANISATIONS' | translate"
-    [ctaLabel]="'ORGANISATION.FORM.CREATE-NEW-ORGANISATION' | translate" [ctaRouterLink]="'new-organisation'">
+    [ctaLabel]="'ORGANISATION.FORM.CREATE-NEW-ORGANISATION' | translate" [ctaRouterLink]="'new-organisation'" [canEdit]="canEdit">
 </app-top-bar>
 <div class="container-fluid">
     <div class="row">
@@ -9,4 +9,4 @@
             </div>
         </div>
     </div>
-</div>
+</div>

src/app/admin/organisation/organisation-list/organisation-list.component.ts

@@ -1,23 +1,29 @@
 import { Component, OnInit } from '@angular/core';
 import { Title } from '@angular/platform-browser';
 import { TranslateService } from '@ngx-translate/core';
-import { Sort } from '@shared/models/sort.model';
+import { MeService } from '@shared/services/me.service';
+import { OrganizationAccessScope } from '@shared/enums/access-scopes';
 
 @Component({
   selector: 'app-organisation-list',
   templateUrl: './organisation-list.component.html',
   styleUrls: ['./organisation-list.component.scss'],
 })
 export class OrganisationListComponent implements OnInit {
-
-  constructor(public translate: TranslateService, private titleService: Title) {
+  canEdit: boolean;
+
+  constructor(
+    public translate: TranslateService,
+    private titleService: Title,
+    private meService: MeService
+  ) {
     translate.use('da');
   }
 
   ngOnInit(): void {
-    this.translate.get(['TITLE.ORGANIZATION'])
-      .subscribe(translations => {
-        this.titleService.setTitle(translations['TITLE.ORGANIZATION']);
-      });
-   }
+    this.translate.get(['TITLE.ORGANIZATION']).subscribe((translations) => {
+      this.titleService.setTitle(translations['TITLE.ORGANIZATION']);
+    });
+    this.canEdit = this.meService.hasAccessToTargetOrganization(OrganizationAccessScope.UserAdministrationWrite);
+  }
 }

src/app/admin/permission/permission-detail/permission-detail.component.html

@@ -1,14 +1,14 @@
 <div *ngIf="permission">
     <app-top-bar [data]="permission" [backButton]="backButton" [subPage]="true" [addDetailDowndown]="true"
-        [dropDownButton]="dropdownButton" (deleteSelectedInDropdown)="onDeletePermission()">
+        [dropDownButton]="dropdownButton" (deleteSelectedInDropdown)="onDeletePermission()" [canEdit]="canEdit">
     </app-top-bar>
     <div class="container-fluid">
         <div class="row">
             <div class="col-12">
                 <div class=" jumbotron">
                     <h3>{{'PERMISSION.DETAIL.HEADLINE' | translate}}</h3>
                     <app-general-details [data]="permission"></app-general-details>
-                    <p><strong>{{'PERMISSION.DETAIL.TYPE' | translate}}</strong>{{permission.type}}</p>
+                    <p><strong>{{'PERMISSION.DETAIL.TYPE' | translate}}</strong>{{permission.type | translatePermissions}}</p>
                     <p><strong>{{'PERMISSION.DETAIL.ORG' | translate}}</strong>
                         {{permission.organization?.name}}
                     </p>
@@ -26,20 +26,17 @@ <h3>
                 </div>
             </div>
         </div>
-        <div class="row">
+        <div class="row" *ngIf="showApplicationTable">
             <div class="col-12">
                 <div class="jumbotron">
                     <h3>
                         {{ 'PERMISSION.DETAIL.APPLICATIONS' | translate }}
                     </h3>
 
-                    <app-applications-table *ngIf="permission.type == 'Write' || permission.type == 'Read'" [permissionId]="id">
-                    </app-applications-table>
-                    <app-applications-table *ngIf="permission.type == 'OrganizationAdmin'" [organizationId]="permission.organization?.id">
-                    </app-applications-table>
-                    <app-applications-table *ngIf="permission.type == 'GlobalAdmin'"></app-applications-table>
+                    <app-applications-table *ngIf="!isApplicationAdmin()" [permissionId]="id" [organizationId]="permission.organization?.id"></app-applications-table>
+                    <app-applications-table *ngIf="isApplicationAdmin()"></app-applications-table>
                 </div>
             </div>
         </div>
     </div>
-</div>
+</div>

src/app/admin/permission/permission-detail/permission-detail.component.ts

@@ -3,14 +3,16 @@ import { ActivatedRoute, Router } from '@angular/router';
 import { TranslateService } from '@ngx-translate/core';
 import { PermissionService } from '@app/admin/permission/permission.service';
 import { Subscription } from 'rxjs';
-import { PermissionResponse } from '../permission.model';
+import { PermissionResponse, PermissionType } from '../permission.model';
 import { BackButton } from '@shared/models/back-button.model';
 import { QuickActionButton } from '@shared/models/quick-action-button.model';
 import { UserResponse } from '@app/admin/users/user.model';
 import { DropdownButton } from '@shared/models/dropdown-button.model';
 import { DeleteDialogService } from '@shared/components/delete-dialog/delete-dialog.service';
 import { environment } from '@environments/environment';
 import { Title } from '@angular/platform-browser';
+import { MeService } from '@shared/services/me.service';
+import { OrganizationAccessScope } from '@shared/enums/access-scopes';
 
 
 @Component({
@@ -43,14 +45,17 @@ export class PermissionDetailComponent implements OnInit, OnChanges {
   subscription: Subscription;
   users: UserResponse[];
   dropdownButton: DropdownButton;
+  canEdit: boolean;
+  showApplicationTable = false;
 
   constructor(
     public translate: TranslateService,
     private route: ActivatedRoute,
     private permissionService: PermissionService,
     private router: Router,
     private titleService: Title,
-    private deleteDialogService: DeleteDialogService
+    private deleteDialogService: DeleteDialogService,
+    private meService: MeService
   ) { }
 
   ngOnInit(): void {
@@ -62,14 +67,15 @@ export class PermissionDetailComponent implements OnInit, OnChanges {
         label: '',
         editRouterLink: 'edit-permission',
         isErasable: true,
-      }
+      };
     }
     this.translate.get(['NAV.PERMISSIONS', 'PERMISSION.DETAIL.DROPDOWN', 'TITLE.PERMISSION'])
       .subscribe(translations => {
         this.backButton.label = translations['NAV.PERMISSIONS'];
         this.dropdownButton.label = translations['PERMISSION.DETAIL.DROPDOWN'];
         this.titleService.setTitle(translations['TITLE.PERMISSION']);
       });
+    this.canEdit = this.meService.hasAccessToTargetOrganization(OrganizationAccessScope.UserAdministrationWrite);
   }
 
   ngOnChanges(changes: SimpleChanges): void {
@@ -82,6 +88,12 @@ export class PermissionDetailComponent implements OnInit, OnChanges {
       .subscribe((response) => {
         this.permission = response;
         this.users = response.users;
+        this.showApplicationTable = this.meService.hasPermissions(
+          response,
+          PermissionType.Read,
+          PermissionType.OrganizationApplicationAdmin,
+          PermissionType.GlobalAdmin
+        );
         this.isLoadingResults = false;
       });
   }
@@ -95,11 +107,20 @@ export class PermissionDetailComponent implements OnInit, OnChanges {
           }
         });
       }
-    })
+    });
   }
 
   onEditPermission() {
     this.router.navigate(['edit-permission'], { relativeTo: this.route });
   }
 
+  isApplicationAdmin () {
+    if (this.permission) {
+      if (this.permission.type.some(perm => perm.type === PermissionType.OrganizationApplicationAdmin)) {
+        return true;
+      }
+    }
+
+	return false;
+  }
 }

src/app/admin/permission/permission-edit/permission-edit.component.html

@@ -21,13 +21,18 @@
 
     <div class="form-group mt-3 col-12">
         <label class="form-label" for="level">{{'PERMISSION.EDIT.TYPE' | translate}}</label>*
-        <select id="level" class="form-select" name="level" [(ngModel)]="permission.level" required
-            [value]="permission.organizationId" [disabled]="isEditMode"
-            [ngClass]="{'is-invalid' : formFailedSubmit && errorFields.includes('organizationId'), 'is-valid' : formFailedSubmit && !errorFields.includes('organizationId')}"
-            placeholder="'PERMISSION.EDIT.TYPE-PLACEHOLDER' | translate">
-            <option *ngFor="let level of allowedLevels()" [value]="level" [selected]="level === permission.level">
-                {{level}}</option>
-        </select>
+        <mat-select id="level" class="form-control" name="level"
+            required
+            [formControl]="permissionLevelsCtrl"
+            [(value)]="permission.levels"
+            [ngClass]="{'is-invalid' : formFailedSubmit && errorFields.includes('level'), 'is-valid' : formFailedSubmit && !errorFields.includes('level')}"
+            [placeholder]="'PERMISSION.EDIT.TYPE-PLACEHOLDER' | translate"
+            [compareWith]="compareLevels"
+            [multiple]="true">
+            <mat-option *ngFor="let level of allowedLevels" [value]="level">
+              {{'PERMISSION-TYPE.' + level.type | translate}}
+            </mat-option>
+        </mat-select>
     </div>
 
     <div class="form-group mt-3 col-12">
@@ -43,7 +48,7 @@
         </mat-form-field>
     </div>
 
-    <div *ngIf="permission.level != 'GlobalAdmin'">
+    <div *ngIf="isNotGlobalAdmin">
         <div class="form-group mt-3 col-12">
             <label class="form-label" for="name">{{'PERMISSION.EDIT.ORG' | translate}}</label>*
             <select id="organizationId" class="form-select" name="organizationId"
@@ -89,4 +94,4 @@
         <button (click)="routeBack()" class="btn btn-secondary" type="button">{{ 'GEN.CANCEL' | translate}}</button>
         <button class="btn btn-primary ml-2" type="submit">{{ 'PERMISSION.SAVE' | translate}}</button>
     </div>
-</form>
+</form>