[Library | Trunk]: Add Notifications on Users page actions. Change loading full background to white

git-svn-id: https://svn.driver.research-infrastructures.eu/driver/dnet40/modules/uoa-services-library/trunk/ng-openaire-library/src/app@59975 d315682c-612b-4755-9ff5-7f18f6832af3

dashboard/users/role-users/role-users.component.html

@@ -1,11 +1,5 @@
 <div page-content>
   <div header>
-    <div *ngIf="error" class="uk-alert uk-alert-danger uk-flex uk-flex-top">
-      <span class="uk-margin-small-right uk-icon" uk-icon="warning"></span>
-      <div>
-        {{error}}
-      </div>
-    </div>
     <ng-content></ng-content>
     <div class="uk-grid uk-flex uk-flex-middle" uk-grid>
       <div class="uk-width-expand uk-flex uk-flex-left@m uk-flex-center">

dashboard/users/role-users/role-users.component.ts

@@ -10,6 +10,7 @@ import {UserManagementService} from "../../../services/user-management.service";
 import {Router} from "@angular/router";
 import {LoginErrorCodes} from "../../../login/utils/guardHelper.class";
 import {Composer} from "../../../utils/email/composer";
+import {StringUtils} from "../../../utils/string-utils.class";
 
 declare var UIkit;
 
@@ -39,7 +40,6 @@ export class RoleUsersComponent implements OnInit, OnDestroy, OnChanges {
   public subs: any[] = [];
   public loadActive: boolean = true;
   public loadPending: boolean = true;
-  public error: string;
   public selectedUser: string = null;
   public invited: FormControl;
   public properties: EnvProperties = properties;
@@ -97,7 +97,6 @@ export class RoleUsersComponent implements OnInit, OnDestroy, OnChanges {
       this.active = [];
       if(error.status === 404) {
         this.exists = false;
-      } else {
       }
       this.loadActive = false;
     }));
@@ -106,8 +105,7 @@ export class RoleUsersComponent implements OnInit, OnDestroy, OnChanges {
       this.loadPending = false;
     }, error => {
       this.active = [];
-      this.error = error.error.response;
+      this.loadPending = false;
-      this.loadActive = false;
     }));
   }
   
@@ -150,10 +148,18 @@ export class RoleUsersComponent implements OnInit, OnDestroy, OnChanges {
     this.userRegistryService.remove(this.type, this.id, this.selectedUser, this.role).subscribe(() => {
       this.active = this.active.filter(user => user.email != this.selectedUser);
       this.userManagementService.updateUserInfo();
+      UIkit.notification(this.selectedUser + ' is no longer ' + this.role + ' of ' + this.name + ' Dashboard', {
+        status: 'success',
+        timeout: 3000,
+        pos: 'top-left'
+      });
       this.loadActive = false;
-      this.error = null;
     }, error => {
-      this.error = error.error.response;
+      UIkit.notification('An error has occurred. Please try again later', {
+        status: 'danger',
+        timeout: 3000,
+        pos: 'top-left'
+      });
       this.loadActive = false;
     });
   }
@@ -162,10 +168,18 @@ export class RoleUsersComponent implements OnInit, OnDestroy, OnChanges {
     this.loadPending = true;
     this.userRegistryService.cancelInvitation(this.type, this.id, this.selectedUser, this.role).subscribe(() => {
       this.pending = this.pending.filter(user => user != this.selectedUser);
-      this.error = null;
+      UIkit.notification(StringUtils.capitalize(this.role) + ' invitation to ' + this.selectedUser + ' has been canceled', {
+        status: 'success',
+        timeout: 3000,
+        pos: 'top-left'
+      });
       this.loadPending = false;
     }, error => {
-      this.error = error.error.response;
+      UIkit.notification('An error has occurred. Please try again later', {
+        status: 'danger',
+        timeout: 3000,
+        pos: 'top-left'
+      });
       this.loadPending = false;
     });
   }
@@ -178,13 +192,21 @@ export class RoleUsersComponent implements OnInit, OnDestroy, OnChanges {
       email: Composer.composeEmailForMonitorDashboard(this.name, this.invited.value, this.role)
     }
     this.userRegistryService.invite(this.type, this.id, details, this.role).subscribe(() => {
-      this.error = null;
       if (!this.pending.includes(this.invited.value)) {
         this.pending.push(this.invited.value);
       }
+      UIkit.notification(StringUtils.capitalize(this.role) + ' invitation to ' + this.selectedUser + ' has been sent', {
+        status: 'success',
+        timeout: 3000,
+        pos: 'top-left'
+      });
       this.loadPending = false;
     }, error => {
-      this.error = error.error.response;
+      UIkit.notification('An error has occurred. Please try again later', {
+        status: 'danger',
+        timeout: 3000,
+        pos: 'top-left'
+      });
       this.loadActive = false;
     })
   }

utils/loading/loading.component.ts

@@ -4,7 +4,7 @@ import {Component, Input} from "@angular/core";
   selector: 'loading',
   template: `
     <ng-template [ngIf]="full" [ngIfElse]="loading">
-      <div class="uk-position-relative" style="height: 100vh; width: 99vw; z-index: 1000; background-color: var(--background-color)">
+      <div class="uk-position-relative" style="height: 100vh; width: 99vw; z-index: 1000; background-color: white">
         <div class="uk-position-center">
           <ng-container [ngTemplateOutlet]="loading"></ng-container>
         </div>