Merge pull request #1820 from wknet123/dev-revised

Updates for message handlers and i18n messages.

src/ui_ng/src/app/app.component.ts

@@ -7,8 +7,7 @@ import { SessionService } from './shared/session.service';
 
 @Component({
     selector: 'harbor-app',
-    templateUrl: 'app.component.html',
+    templateUrl: 'app.component.html'
-    styleUrls: []
 })
 export class AppComponent {
     constructor(

src/ui_ng/src/app/log/audit-log.component.ts

@@ -6,7 +6,7 @@ import { SessionUser } from '../shared/session-user';
 
 import { AuditLogService } from './audit-log.service';
 import { SessionService } from '../shared/session.service';
-import { MessageService } from '../global-message/message.service';
+import { MessageHandlerService } from '../shared/message-handler/message-handler.service';
 import { AlertType } from '../shared/shared.const';
 
 import { State } from 'clarity-angular';
@@ -30,7 +30,6 @@ class FilterOption {
 }
 
 @Component({
-  moduleId: module.id,
   selector: 'audit-log',
   templateUrl: './audit-log.component.html',
   styleUrls: [ './audit-log.component.css' ]
@@ -58,7 +57,7 @@ export class AuditLogComponent implements OnInit {
   totalRecordCount: number;
   totalPage: number;
   
-  constructor(private route: ActivatedRoute, private router: Router, private auditLogService: AuditLogService, private messageService: MessageService) {
+  constructor(private route: ActivatedRoute, private router: Router, private auditLogService: AuditLogService, private messageHandlerService: MessageHandlerService) {
     //Get current user from registered resolver.
     this.route.data.subscribe(data=>this.currentUser = <SessionUser>data['auditLogResolver']);    
   }
@@ -85,7 +84,7 @@ export class AuditLogComponent implements OnInit {
           },
           error=>{
             this.router.navigate(['/harbor', 'projects']);
-            this.messageService.announceMessage(error.status, 'Failed to list audit logs with project ID:' + this.queryParam.project_id, AlertType.DANGER);
+            this.messageHandlerService.handleError(error);
           }
         );
   }

src/ui_ng/src/app/project/create-project/create-project.component.ts

@@ -5,10 +5,7 @@ import { NgForm } from '@angular/forms';
 import { Project } from '../project';
 import { ProjectService } from '../project.service';
 
-
+import { MessageHandlerService } from '../../shared/message-handler/message-handler.service';
-import { MessageService } from '../../global-message/message.service';
-import { AlertType } from '../../shared/shared.const';
-
 import { InlineAlertComponent } from '../../shared/inline-alert/inline-alert.component';
 
 import { TranslateService } from '@ngx-translate/core';
@@ -39,9 +36,9 @@ export class CreateProjectComponent implements AfterViewChecked {
   @ViewChild(InlineAlertComponent)
   private inlineAlert: InlineAlertComponent;
 
-  constructor(private projectService: ProjectService, 
+  constructor(private projectService: ProjectService,             
-              private messageService: MessageService,
+              private translateService: TranslateService,
-              private translateService: TranslateService) {}
+              private messageHandlerService: MessageHandlerService) {}
 
   onSubmit() {
     this.projectService
@@ -49,7 +46,7 @@ export class CreateProjectComponent implements AfterViewChecked {
         .subscribe(
           status=>{
             this.create.emit(true);
-            this.messageService.announceMessage(status, 'PROJECT.CREATED_SUCCESS', AlertType.SUCCESS);
+            this.messageHandlerService.showSuccess('PROJECT.CREATED_SUCCESS');
             this.createProjectOpened = false;
           },
           error=>{
@@ -63,12 +60,14 @@ export class CreateProjectComponent implements AfterViewChecked {
                 this.translateService.get('PROJECT.NAME_IS_ILLEGAL').subscribe(res=>errorMessage = res); 
                 break;
               default:
-                this.translateService.get('PROJECT.UNKNOWN_ERROR').subscribe(res=>{
+                this.translateService.get('PROJECT.UNKNOWN_ERROR').subscribe(res=>errorMessage = res);
-                  errorMessage = res;
+              }
-                  this.messageService.announceMessage(error.status, errorMessage, AlertType.DANGER);
+              if(this.messageHandlerService.isAppLevel(error)) {
-                });
+                this.messageHandlerService.handleError(error);
+                this.createProjectOpened = false;
+              } else {
+                this.inlineAlert.showInlineError(errorMessage);
               }
-              this.inlineAlert.showInlineError(errorMessage);
             }
           }); 
   }

src/ui_ng/src/app/project/list-project/list-project.component.ts

@@ -10,7 +10,6 @@ import { ProjectTypes, RoleInfo } from '../../shared/shared.const';
 import { State } from 'clarity-angular';
 
 @Component({
-  moduleId: module.id,
   selector: 'list-project',
   templateUrl: 'list-project.component.html'
 })

src/ui_ng/src/app/project/member/add-member/add-member.component.ts

@@ -3,10 +3,8 @@ import { Response } from '@angular/http';
 import { NgForm } from '@angular/forms';
  
 import { MemberService } from '../member.service';
-import { MessageService } from '../../../global-message/message.service';
-import { AlertType } from '../../../shared/shared.const';
-
 
+import { MessageHandlerService } from '../../../shared/message-handler/message-handler.service';
 import { InlineAlertComponent } from '../../../shared/inline-alert/inline-alert.component';
 
 import { TranslateService } from '@ngx-translate/core';
@@ -41,17 +39,16 @@ export class AddMemberComponent implements AfterViewChecked {
   @Output() added = new EventEmitter<boolean>();
 
   constructor(private memberService: MemberService, 
-              private messageService: MessageService, 
+              private messageHandlerService: MessageHandlerService, 
               private translateService: TranslateService) {}
 
   onSubmit(): void {
     if(!this.member.username || this.member.username.length === 0) { return; }
-    console.log('Adding member:' + JSON.stringify(this.member));
     this.memberService
         .addMember(this.projectId, this.member.username, +this.member.role_id)
         .subscribe(
           response=>{
-            this.messageService.announceMessage(response, 'MEMBER.ADDED_SUCCESS', AlertType.SUCCESS);
+            this.messageHandlerService.showSuccess('MEMBER.ADDED_SUCCESS');
             console.log('Added member successfully.');
             this.added.emit(true);
             this.addMemberOpened = false;
@@ -69,9 +66,14 @@ export class AddMemberComponent implements AfterViewChecked {
               default:
                 errorMessageKey = 'MEMBER.UNKNOWN_ERROR';              
               }
+              if(this.messageHandlerService.isAppLevel(error)) {
+                this.messageHandlerService.handleError(error);
+                this.addMemberOpened = false;
+              } else {
                this.translateService
                   .get(errorMessageKey)
                   .subscribe(errorMessage=>this.inlineAlert.showInlineError(errorMessage));
+              }
             }
             console.log('Failed to add member of project:' + this.projectId, ' with error:' + error);
           }

src/ui_ng/src/app/project/member/member.component.ts

@@ -8,8 +8,8 @@ import { MemberService } from './member.service';
 
 import { AddMemberComponent } from './add-member/add-member.component';
 
-import { MessageService } from '../../global-message/message.service';
+import { MessageHandlerService } from '../../shared/message-handler/message-handler.service';
-import { AlertType, ConfirmationTargets, ConfirmationState } from '../../shared/shared.const';
+import { ConfirmationTargets, ConfirmationState } from '../../shared/shared.const';
 
 import { ConfirmationDialogService } from '../../shared/confirmation-dialog/confirmation-dialog.service';
 import { ConfirmationMessage } from '../../shared/confirmation-dialog/confirmation-message';
@@ -27,7 +27,6 @@ import { Subscription } from 'rxjs/Subscription';
 import { Project } from '../../project/project';
 
 @Component({
-  moduleId: module.id,
   templateUrl: 'member.component.html',
   styleUrls: ['./member.component.css']
 })
@@ -44,8 +43,11 @@ export class MemberComponent implements OnInit, OnDestroy {
   currentUser: SessionUser;
   hasProjectAdminRole: boolean;
 
-  constructor(private route: ActivatedRoute, private router: Router,
+  constructor(
-    private memberService: MemberService, private messageService: MessageService,
+    private route: ActivatedRoute,
+    private router: Router,
+    private memberService: MemberService, 
+    private messageHandlerService: MessageHandlerService,
     private deletionDialogService: ConfirmationDialogService,
     private session: SessionService) {
     
@@ -57,11 +59,11 @@ export class MemberComponent implements OnInit, OnDestroy {
           .deleteMember(this.projectId, message.data)
           .subscribe(
           response => {
-            this.messageService.announceMessage(response, 'MEMBER.DELETED_SUCCESS', AlertType.SUCCESS);
+            this.messageHandlerService.showSuccess('MEMBER.DELETED_SUCCESS');
             console.log('Successful delete member: ' + message.data);
             this.retrieve(this.projectId, '');
           },
-          error => this.messageService.announceMessage(error.status, 'Failed to change role with user ' + message.data, AlertType.DANGER)
+          error => this.messageHandlerService.handleError(error)
           );
       }
     });
@@ -74,7 +76,7 @@ export class MemberComponent implements OnInit, OnDestroy {
       response => this.members = response,
       error => {
         this.router.navigate(['/harbor', 'projects']);
-        this.messageService.announceMessage(error.status, 'Failed to get project member with project ID:' + projectId, AlertType.DANGER);
+        this.messageHandlerService.handleError(error);
       });
   }
 
@@ -115,11 +117,11 @@ export class MemberComponent implements OnInit, OnDestroy {
         .changeMemberRole(this.projectId, m.user_id, roleId)
         .subscribe(
         response => {
-          this.messageService.announceMessage(response, 'MEMBER.SWITCHED_SUCCESS', AlertType.SUCCESS);
+          this.messageHandlerService.showSuccess('MEMBER.SWITCHED_SUCCESS');
           console.log('Successful change role with user ' + m.user_id + ' to roleId ' + roleId);
           this.retrieve(this.projectId, '');
         },
-        error => this.messageService.announceMessage(error.status, 'Failed to change role with user ' + m.user_id + ' to roleId ' + roleId, AlertType.DANGER)
+        error => this.messageHandlerService.handleError(error)
         );
       }
   }

src/ui_ng/src/app/project/project.component.ts

@@ -9,10 +9,9 @@ import { CreateProjectComponent } from './create-project/create-project.componen
 
 import { ListProjectComponent } from './list-project/list-project.component';
 
-import { MessageService } from '../global-message/message.service';
+import { MessageHandlerService } from '../shared/message-handler/message-handler.service';
 import { Message } from '../global-message/message';
 
-import { AlertType } from '../shared/shared.const';
 import { Response } from '@angular/http';
 
 import { ConfirmationDialogService } from '../shared/confirmation-dialog/confirmation-dialog.service';
@@ -28,7 +27,6 @@ import { SessionService } from '../shared/session.service';
 import { ProjectTypes } from '../shared/shared.const';
 
 @Component({
-  moduleId: module.id,
   selector: 'project',
   templateUrl: 'project.component.html',
   styleUrls: ['./project.component.css']
@@ -60,7 +58,7 @@ export class ProjectComponent implements OnInit, OnDestroy {
 
   constructor(
     private projectService: ProjectService,
-    private messageService: MessageService,
+    private messageHandlerService: MessageHandlerService,
     private appConfigService: AppConfigService,
     private sessionService: SessionService,
     private deletionDialogService: ConfirmationDialogService) {
@@ -73,11 +71,11 @@ export class ProjectComponent implements OnInit, OnDestroy {
           .deleteProject(projectId)
           .subscribe(
           response => {
-            this.messageService.announceMessage(response, 'PROJECT.DELETED_SUCCESS', AlertType.SUCCESS);
+            this.messageHandlerService.showSuccess('PROJECT.DELETED_SUCCESS');
             console.log('Successful delete project with ID:' + projectId);
             this.retrieve();
           },
-          error => this.messageService.announceMessage(error.status, error, AlertType.WARNING)
+          error =>this.messageHandlerService.handleError(error)
           );
       }
     });
@@ -122,7 +120,7 @@ export class ProjectComponent implements OnInit, OnDestroy {
         console.log('TotalRecordCount:' + this.totalRecordCount + ', totalPage:' + this.totalPage);
         this.changedProjects = response.json();
       },
-      error => this.messageService.announceAppLevelMessage(error.status, error, AlertType.WARNING)
+      error => this.messageHandlerService.handleError(error)
       );
   }
 
@@ -132,6 +130,7 @@ export class ProjectComponent implements OnInit, OnDestroy {
 
   createProject(created: boolean) {
     if (created) {
+      this.projectName = '';
       this.retrieve();
     }
   }
@@ -156,10 +155,10 @@ export class ProjectComponent implements OnInit, OnDestroy {
         .toggleProjectPublic(p.project_id, p.public)
         .subscribe(
         response => {
-          this.messageService.announceMessage(response, 'PROJECT.TOGGLED_SUCCESS', AlertType.SUCCESS);
+          this.messageHandlerService.showSuccess('PROJECT.TOGGLED_SUCCESS');
           console.log('Successful toggled project_id:' + p.project_id);
         },
-        error => this.messageService.announceMessage(error.status, error, AlertType.WARNING)
+        error => this.messageHandlerService.handleError(error)
         );
     }
   }

src/ui_ng/src/app/replication/create-edit-destination/create-edit-destination.component.ts

@@ -2,8 +2,8 @@ import { Component, Output, EventEmitter, ViewChild, AfterViewChecked } from '@a
 import { NgForm } from '@angular/forms';
 
 import { ReplicationService } from '../replication.service';
-import { MessageService } from '../../global-message/message.service';
+import { MessageHandlerService } from '../../shared/message-handler/message-handler.service';
-import { AlertType, ActionType } from '../../shared/shared.const';
+import { ActionType } from '../../shared/shared.const';
 
 import { InlineAlertComponent } from '../../shared/inline-alert/inline-alert.component';
 
@@ -46,7 +46,7 @@ export class CreateEditDestinationComponent implements AfterViewChecked {
   
   constructor(
     private replicationService: ReplicationService,
-    private messageService: MessageService,
+    private messageHandlerService: MessageHandlerService,
     private translateService: TranslateService) {}
 
   openCreateEditTarget(targetId?: number) {
@@ -72,8 +72,7 @@ export class CreateEditDestinationComponent implements AfterViewChecked {
               this.initVal.username = this.target.username;
               this.initVal.password = this.target.password;
             },
-            error=>this.messageService
+            error=>this.messageHandlerService.handleError(error)
-                       .announceMessage(error.status, 'DESTINATION.FAILED_TO_GET_TARGET', AlertType.DANGER)
           );
     } else {
       this.actionType = ActionType.ADD_NEW;
@@ -108,7 +107,7 @@ export class CreateEditDestinationComponent implements AfterViewChecked {
           .createTarget(this.target)
           .subscribe(
             response=>{
-              this.messageService.announceMessage(response, 'DESTINATION.CREATED_SUCCESS', AlertType.SUCCESS);
+              this.messageHandlerService.showSuccess('DESTINATION.CREATED_SUCCESS');
               console.log('Successful added target.');
               this.createEditDestinationOpened = false;
               this.reload.emit(true);
@@ -129,8 +128,12 @@ export class CreateEditDestinationComponent implements AfterViewChecked {
               this.translateService
                   .get(errorMessageKey)
                   .subscribe(res=>{
-                    this.messageService.announceMessage(error.status, errorMessageKey, AlertType.DANGER);
+                    if(this.messageHandlerService.isAppLevel(error)) {
-                    this.inlineAlert.showInlineError(res);
+                      this.messageHandlerService.handleError(error);
+                      this.createEditDestinationOpened = false;
+                    } else {
+                      this.inlineAlert.showInlineError(res);
+                    }
                   });
             }
           );
@@ -140,7 +143,7 @@ export class CreateEditDestinationComponent implements AfterViewChecked {
           .updateTarget(this.target)
           .subscribe(
             response=>{ 
-              this.messageService.announceMessage(response, 'DESTINATION.UPDATED_SUCCESS', AlertType.SUCCESS);
+              this.messageHandlerService.showSuccess('DESTINATION.UPDATED_SUCCESS');
               console.log('Successful updated target.');
               this.createEditDestinationOpened = false;
               this.reload.emit(true);
@@ -160,8 +163,12 @@ export class CreateEditDestinationComponent implements AfterViewChecked {
               this.translateService
                   .get(errorMessageKey)
                   .subscribe(res=>{
-                    this.inlineAlert.showInlineError(res);
+                    if(this.messageHandlerService.isAppLevel(error)) {
-                    this.messageService.announceMessage(error.status, errorMessageKey, AlertType.DANGER);
+                      this.messageHandlerService.handleError(error);
+                      this.createEditDestinationOpened = false;
+                    } else {
+                      this.inlineAlert.showInlineError(res);
+                    }
                   });
             }
           );

src/ui_ng/src/app/replication/destination/destination.component.ts

@@ -1,8 +1,7 @@
 import { Component, OnInit, ViewChild, OnDestroy } from '@angular/core';
 import { Target } from '../target';
 import { ReplicationService } from '../replication.service';
-import { MessageService } from '../../global-message/message.service';
+import { MessageHandlerService } from '../../shared/message-handler/message-handler.service';
-import { AlertType } from '../../shared/shared.const';
 
 import { ConfirmationDialogService } from '../../shared/confirmation-dialog/confirmation-dialog.service';
 import { ConfirmationMessage } from '../../shared/confirmation-dialog/confirmation-message';
@@ -14,7 +13,6 @@ import { Subscription } from 'rxjs/Subscription';
 import { CreateEditDestinationComponent } from '../create-edit-destination/create-edit-destination.component';
 
 @Component({
-  moduleId: module.id,
   selector: 'destination',
   templateUrl: 'destination.component.html',
   styleUrls: ['./destination.component.css']
@@ -32,7 +30,7 @@ export class DestinationComponent implements OnInit {
 
   constructor(
     private replicationService: ReplicationService,
-    private messageService: MessageService,
+    private messageHandlerService: MessageHandlerService,
     private deletionDialogService: ConfirmationDialogService) {
     this.subscription = this.deletionDialogService.confirmationConfirm$.subscribe(message => {
       if (message &&
@@ -43,13 +41,12 @@ export class DestinationComponent implements OnInit {
           .deleteTarget(targetId)
           .subscribe(
           response => {
-            this.messageService.announceMessage(response, 'DESTINATION.DELETED_SUCCESS', AlertType.SUCCESS);
+            this.messageHandlerService.showSuccess('DESTINATION.DELETED_SUCCESS');
             console.log('Successful deleted target with ID:' + targetId);
             this.reload();
           },
           error => { 
-            this.messageService
+            this.messageHandlerService.handleError(error);
-                .announceMessage(error.status,'DESTINATION.DELETED_FAILED', AlertType.DANGER);
             console.log('Failed to delete target with ID:' + targetId + ', error:' + error);
           });
       }
@@ -72,7 +69,7 @@ export class DestinationComponent implements OnInit {
       .listTargets(targetName)
       .subscribe(
       targets => this.targets = targets,
-      error => this.messageService.announceMessage(error.status, 'Failed to get targets:' + error, AlertType.DANGER)
+      error => this.messageHandlerService.handleError(error)
       );
   }
 
@@ -86,7 +83,7 @@ export class DestinationComponent implements OnInit {
   }
 
   reload() {
-    this.retrieve(this.targetName);
+    this.retrieve('');
   }
 
   openModal() {

src/ui_ng/src/app/replication/replication-management/replication-management.component.ts

@@ -1,7 +1,6 @@
 import { Component } from '@angular/core';
 
 @Component({
-  moduleId: module.id,
   selector: 'replication-management',
   templateUrl: 'replication-management.component.html',
   styleUrls: [ './replication-management.component.css' ]

src/ui_ng/src/app/replication/replication.component.ts

@@ -3,8 +3,7 @@ import { ActivatedRoute } from '@angular/router';
 
 import { CreateEditPolicyComponent } from '../shared/create-edit-policy/create-edit-policy.component';
 
-import { MessageService } from '../global-message/message.service';
+import { MessageHandlerService } from '../shared/message-handler/message-handler.service';
-import { AlertType } from '../shared/shared.const';
 
 import { SessionService } from '../shared/session.service';
 
@@ -48,7 +47,6 @@ class SearchOption {
 }
 
 @Component({
-  moduleId: module.id,
   selector: 'replicaton',
   templateUrl: 'replication.component.html',
   styleUrls: ['./replication.component.css']
@@ -84,7 +82,7 @@ export class ReplicationComponent implements OnInit {
 
    constructor(
      private sessionService: SessionService, 
-     private messageService: MessageService,
+     private messageHandlerService: MessageHandlerService,
      private replicationService: ReplicationService,
      private route: ActivatedRoute) {
      this.currentUser = this.sessionService.getCurrentUser();
@@ -122,7 +120,7 @@ export class ReplicationComponent implements OnInit {
                this.changedJobs = [];
              }
            },
-           error=>this.messageService.announceMessage(error.status,'Failed to get policies with project ID:' + this.projectId, AlertType.DANGER)
+           error=>this.messageHandlerService.handleError(error)
          );
    }
 
@@ -151,7 +149,7 @@ export class ReplicationComponent implements OnInit {
              this.changedJobs = response.json();
              this.jobs = this.changedJobs;
            },
-           error=>this.messageService.announceMessage(error.status, 'Failed to fetch jobs with policy ID:' + this.search.policyId, AlertType.DANGER)
+           error=>this.messageHandlerService.handleError(error)
          );
    }
 
@@ -194,6 +192,7 @@ export class ReplicationComponent implements OnInit {
 
    reloadPolicies(isReady: boolean) {
      if(isReady) {
+       this.search.policyName = '';
        this.retrievePolicies();
      }
    }

src/ui_ng/src/app/replication/total-replication/total-replication.component.ts

@@ -3,13 +3,11 @@ import { ReplicationService } from '../../replication/replication.service';
 
 import { CreateEditPolicyComponent } from '../../shared/create-edit-policy/create-edit-policy.component';
 
-import { MessageService } from '../../global-message/message.service';
+import { MessageHandlerService } from '../../shared/message-handler/message-handler.service';
-import { AlertType } from '../../shared/shared.const';
 
 import { Policy } from '../../replication/policy';
 
 @Component({
-  moduleId: module.id,
   selector: 'total-replication',
   templateUrl: 'total-replication.component.html',
   providers: [ ReplicationService ],
@@ -27,7 +25,7 @@ export class TotalReplicationComponent implements OnInit {
 
   constructor(
     private replicationService: ReplicationService,
-    private messageService: MessageService) {}
+    private messageHandlerService: MessageHandlerService) {}
 
   ngOnInit() {
     this.retrievePolicies();
@@ -41,7 +39,7 @@ export class TotalReplicationComponent implements OnInit {
             this.changedPolicies = response;
             this.policies = this.changedPolicies;
           },
-          error=>this.messageService.announceMessage(error.status,'Failed to get policies.', AlertType.DANGER)
+          error=>this.messageHandlerService.handleError(error)
         );
   }
 

src/ui_ng/src/app/repository/repository.component.ts

@@ -4,8 +4,8 @@ import { ActivatedRoute } from '@angular/router';
 import { RepositoryService } from './repository.service';
 import { Repository } from './repository';
 
-import { MessageService } from '../global-message/message.service';
+import { MessageHandlerService } from '../shared/message-handler/message-handler.service';
-import { AlertType, ConfirmationState, ConfirmationTargets } from '../shared/shared.const';
+import { ConfirmationState, ConfirmationTargets } from '../shared/shared.const';
 
 
 import { ConfirmationDialogService } from '../shared/confirmation-dialog/confirmation-dialog.service';
@@ -17,7 +17,6 @@ import { State } from 'clarity-angular';
 import { Project } from '../project/project';
 
 @Component({
-  moduleId: module.id,
   selector: 'repository',
   templateUrl: 'repository.component.html',
   styleUrls: ['./repository.component.css']
@@ -42,7 +41,7 @@ export class RepositoryComponent implements OnInit {
   constructor(
     private route: ActivatedRoute,
     private repositoryService: RepositoryService,
-    private messageService: MessageService,
+    private messageHandlerService: MessageHandlerService,
     private deletionDialogService: ConfirmationDialogService
   ) {
     this.subscription = this.deletionDialogService
@@ -58,11 +57,11 @@ export class RepositoryComponent implements OnInit {
             .subscribe(
             response => {
               this.refresh();
-              this.messageService.announceMessage(response, 'REPOSITORY.DELETED_REPO_SUCCESS', AlertType.SUCCESS);
+              this.messageHandlerService.showSuccess('REPOSITORY.DELETED_REPO_SUCCESS');
               console.log('Successful deleted repo:' + repoName);
             },
-            error => this.messageService.announceMessage(error.status, 'Failed to delete repo:' + repoName, AlertType.DANGER)
+            error => this.messageHandlerService.handleError(error)
-            );
+          );
         }
       });
  
@@ -97,7 +96,7 @@ export class RepositoryComponent implements OnInit {
         console.log('TotalRecordCount:' + this.totalRecordCount + ', totalPage:' + this.totalPage);
         this.changedRepositories = response.json();
       },
-      error => this.messageService.announceMessage(error.status, 'Failed to list repositories.', AlertType.DANGER)
+      error => this.messageHandlerService.handleError(error)
       );
   }
 

src/ui_ng/src/app/repository/tag-repository/tag-repository.component.ts

@@ -2,8 +2,8 @@ import { Component, OnInit, OnDestroy } from '@angular/core';
 import { ActivatedRoute } from '@angular/router';
 
 import { RepositoryService } from '../repository.service';
-import { MessageService } from '../../global-message/message.service';
+import { MessageHandlerService } from '../../shared/message-handler/message-handler.service';
-import { AlertType, ConfirmationTargets, ConfirmationState } from '../../shared/shared.const';
+import { ConfirmationTargets, ConfirmationState } from '../../shared/shared.const';
 
 import { ConfirmationDialogService } from '../../shared/confirmation-dialog/confirmation-dialog.service';
 import { ConfirmationMessage } from '../../shared/confirmation-dialog/confirmation-message';
@@ -20,7 +20,6 @@ import { SessionService } from '../../shared/session.service';
 import { Project } from '../../project/project';
 
 @Component({
-  moduleId: module.id,
   selector: 'tag-repository',
   templateUrl: 'tag-repository.component.html',
   styleUrls: ['./tag-repository.component.css']
@@ -42,7 +41,7 @@ export class TagRepositoryComponent implements OnInit, OnDestroy {
 
   constructor(
     private route: ActivatedRoute,
-    private messageService: MessageService,
+    private messageHandlerService: MessageHandlerService,
     private deletionDialogService: ConfirmationDialogService,
     private repositoryService: RepositoryService,
     private appConfigService: AppConfigService,
@@ -64,11 +63,11 @@ export class TagRepositoryComponent implements OnInit, OnDestroy {
                 .subscribe(
                 response => {
                   this.retrieve();
-                  this.messageService.announceMessage(response, 'REPOSITORY.DELETED_TAG_SUCCESS', AlertType.SUCCESS);
+                  this.messageHandlerService.showSuccess('REPOSITORY.DELETED_TAG_SUCCESS');
                   console.log('Deleted repo:' + this.repoName + ' with tag:' + tagName);
                 },
-                error => this.messageService.announceMessage(error.status, 'Failed to delete tag:' + tagName + ' under repo:' + this.repoName, AlertType.DANGER)
+                error => this.messageHandlerService.handleError(error)
-                );
+              );
             }
           }
         }
@@ -102,13 +101,13 @@ export class TagRepositoryComponent implements OnInit, OnDestroy {
           .listTagsWithVerifiedSignatures(this.repoName)
           .subscribe(
             items => this.listTags(items),
-            error => this.messageService.announceMessage(error.status, 'Failed to list tags with repo:' + this.repoName, AlertType.DANGER));
+            error => this.messageHandlerService.handleError(error));
     } else {
       this.repositoryService
           .listTags(this.repoName)
           .subscribe(
             items => this.listTags(items),
-            error => this.messageService.announceMessage(error.status, 'Failed to list tags with repo:' + this.repoName, AlertType.DANGER));
+            error => this.messageHandlerService.handleError(error));
     }
   }
 

src/ui_ng/src/app/repository/top-repo/top-repo.component.ts

@@ -2,7 +2,7 @@ import { Component, OnInit } from '@angular/core';
 
 import { errorHandler } from '../../shared/shared.utils';
 import { AlertType, ListMode } from '../../shared/shared.const';
-import { MessageService } from '../../global-message/message.service';
+import { MessageHandlerService } from '../../shared/message-handler/message-handler.service';
 import { TopRepoService } from './top-repository.service';
 import { Repository } from '../repository';
 
@@ -18,7 +18,7 @@ export class TopRepoComponent implements OnInit{
 
     constructor(
         private topRepoService: TopRepoService,
-        private msgService: MessageService
+        private messageHandlerService: MessageHandlerService
     ) { }
 
     public get listMode(): string {
@@ -35,7 +35,7 @@ export class TopRepoComponent implements OnInit{
         this.topRepoService.getTopRepos()
             .then(repos => this.topRepos = repos )
             .catch(error => {
-                this.msgService.announceMessage(error.status, errorHandler(error), AlertType.WARNING);
+                this.messageHandlerService.handleError(error);
             })
     }
 }

src/ui_ng/src/app/shared/create-edit-policy/create-edit-policy.component.html

@@ -18,7 +18,7 @@
           <input type="text" class="col-md-8" id="policy_description" [(ngModel)]="createEditPolicy.description" name="description" size="20" #description="ngModel" [disabled]="readonly"> 
         </div>
         <div class="form-group">
-          <label class="col-md-4">{{'REPLICATION.ENABLE' | translate}}</label>
+          <label class="col-md-4 form-group-label-override">{{'REPLICATION.ENABLE' | translate}}</label>
           <div class="checkbox-inline">
             <input type="checkbox" id="policy_enable" [(ngModel)]="createEditPolicy.enable" name="enable" #enable="ngModel" [disabled]="untoggleable">
             <label for="policy_enable"></label>

src/ui_ng/src/app/shared/create-edit-policy/create-edit-policy.component.ts

@@ -5,8 +5,8 @@ import { NgForm } from '@angular/forms';
 import { CreateEditPolicy } from './create-edit-policy';
 
 import { ReplicationService } from '../../replication/replication.service';
-import { MessageService } from '../../global-message/message.service';
+import { MessageHandlerService } from '../message-handler/message-handler.service';
-import { AlertType, ActionType } from '../../shared/shared.const';
+import { ActionType } from '../../shared/shared.const';
 
 import { InlineAlertComponent } from '../../shared/inline-alert/inline-alert.component';
 
@@ -66,7 +66,7 @@ export class CreateEditPolicyComponent implements OnInit, AfterViewChecked {
 
   constructor(
     private replicationService: ReplicationService,
-    private messageService: MessageService,
+    private messageHandlerService: MessageHandlerService,
     private translateService: TranslateService) {}
   
   prepareTargets(targetId?: number) {
@@ -90,7 +90,10 @@ export class CreateEditPolicyComponent implements OnInit, AfterViewChecked {
               this.initVal.password = this.createEditPolicy.password;
             }
           },
-          error=>this.messageService.announceMessage(error.status, 'Error occurred while get targets.', AlertType.DANGER)
+          error=>{ 
+            this.messageHandlerService.handleError(error);
+            this.createEditPolicyOpened = false;
+          }
         );
   }
 
@@ -183,13 +186,18 @@ export class CreateEditPolicyComponent implements OnInit, AfterViewChecked {
         .createPolicy(this.getPolicyByForm())
         .subscribe(
           response=>{
-            this.messageService.announceMessage(response, 'REPLICATION.CREATED_SUCCESS', AlertType.SUCCESS);
+            this.messageHandlerService.showSuccess('REPLICATION.CREATED_SUCCESS');
             console.log('Successful created policy: ' + response);
             this.createEditPolicyOpened = false;
             this.reload.emit(true);
           },
           error=>{
-            this.inlineAlert.showInlineError(error['_body']);
+            if(this.messageHandlerService.isAppLevel(error)) {
+              this.messageHandlerService.handleError(error);
+              this.createEditPolicyOpened = false;
+            } else {
+              this.inlineAlert.showInlineError(error);
+            }            
             console.log('Failed to create policy:' + error.status + ', error message:' + JSON.stringify(error['_body']));
           });
   }
@@ -200,13 +208,18 @@ export class CreateEditPolicyComponent implements OnInit, AfterViewChecked {
         .createOrUpdatePolicyWithNewTarget(this.getPolicyByForm(), this.getTargetByForm())
         .subscribe(
           response=>{
-            this.messageService.announceMessage(response, 'REPLICATION.UPDATED_SUCCESS', AlertType.SUCCESS);
+            this.messageHandlerService.showSuccess('REPLICATION.CREATED_SUCCESS');
             console.log('Successful created policy and target:' + response);
             this.createEditPolicyOpened = false;
             this.reload.emit(true);
           },
           error=>{
-            this.inlineAlert.showInlineError(error['_body']);
+            if(this.messageHandlerService.isAppLevel(error)) {
+              this.messageHandlerService.handleError(error);
+              this.createEditPolicyOpened = false;  
+            } else {
+              this.inlineAlert.showInlineError(error);
+            }
             console.log('Failed to create policy and target:' + error.status + ', error message:' + JSON.stringify(error['_body']));
           }
         );
@@ -219,11 +232,17 @@ export class CreateEditPolicyComponent implements OnInit, AfterViewChecked {
         .subscribe(
           response=>{
             console.log('Successful created policy and target:' + response);
+            this.messageHandlerService.showSuccess('REPLICATION.UPDATED_SUCCESS')
             this.createEditPolicyOpened = false;
             this.reload.emit(true);
           },
           error=>{
-            this.inlineAlert.showInlineError(error['_body']);
+            if(this.messageHandlerService.isAppLevel(error)) {
+              this.messageHandlerService.handleError(error);
+              this.createEditPolicyOpened = false;
+            } else {
+              this.inlineAlert.showInlineError(error);
+            }
             console.log('Failed to create policy and target:' + error.status + ', error message:' + JSON.stringify(error['_body']));
           }
         );

src/ui_ng/src/app/shared/list-policy/list-policy.component.ts

@@ -8,8 +8,7 @@ import { ConfirmationMessage } from '../../shared/confirmation-dialog/confirmati
 
 import { ConfirmationState, ConfirmationTargets } from '../../shared/shared.const';
 
-import { MessageService } from '../../global-message/message.service';
+import { MessageHandlerService } from '../../shared/message-handler/message-handler.service';
-import { AlertType } from '../../shared/shared.const';
 
 import { Subscription } from 'rxjs/Subscription';
 
@@ -35,7 +34,7 @@ export class ListPolicyComponent implements OnDestroy {
     private replicationService: ReplicationService,
     private toggleConfirmDialogService: ConfirmationDialogService,
     private deletionDialogService: ConfirmationDialogService,
-    private messageService: MessageService) {
+    private messageHandlerService: MessageHandlerService) {
 
     this.toggleSubscription = this.toggleConfirmDialogService
         .confirmationConfirm$
@@ -51,10 +50,10 @@ export class ListPolicyComponent implements OnDestroy {
                    .enablePolicy(policy.id, policy.enabled)
                    .subscribe(
                       response => {
-                        this.messageService.announceMessage(response, 'REPLICATION.TOGGLED_SUCCESS', AlertType.SUCCESS);
+                        this.messageHandlerService.showSuccess('REPLICATION.TOGGLED_SUCCESS');
                         console.log('Successful toggled policy status')
                       },
-                      error => this.messageService.announceMessage(error.status, "Failed to toggle policy status.", AlertType.DANGER)
+                      error => this.messageHandlerService.handleError(error)
                    );
              }
           }
@@ -70,11 +69,11 @@ export class ListPolicyComponent implements OnDestroy {
                 .deletePolicy(message.data)
                 .subscribe(
                   response => {
-                    this.messageService.announceMessage(response, 'REPLICATION.DELETED_SUCCESS', AlertType.SUCCESS);
+                    this.messageHandlerService.showSuccess('REPLICATION.DELETED_SUCCESS');
                     console.log('Successful delete policy with ID:' + message.data);
                     this.reload.emit(true);
                   },
-                  error => this.messageService.announceMessage(error.status, 'REPLICATION.DELETED_FAILED', AlertType.DANGER)
+                  error => this.messageHandlerService.handleError(error)
                 );
         }
       }

src/ui_ng/src/app/shared/list-project-ro/list-project-ro.component.ts

@@ -7,7 +7,6 @@ import { Project } from '../../project/project';
 import { State } from 'clarity-angular';
 
 @Component({
-  moduleId: module.id,
   selector: 'list-project-ro',
   templateUrl: 'list-project-ro.component.html'
 })

src/ui_ng/src/app/shared/message-handler/message-handler.service.ts

@@ -16,14 +16,15 @@ export class MessageHandlerService {
         if (!error) {
             return;
         }
+        console.log(JSON.stringify(error));
 
-        if (!error.statusCode) {
+        if (!(error.statusCode || error.status)) {
             //treat as string message
-            let msg = "" + error;
+            let msg = '' + error;
             this.msgService.announceMessage(500, msg, AlertType.DANGER);
         } else {
             let msg = 'UNKNOWN_ERROR';
-            switch (error.statusCode) {
+            switch (error.statusCode || error.status) {
                 case 400:
                     msg = "BAD_REQUEST_ERROR";
                     break;
@@ -37,6 +38,7 @@ export class MessageHandlerService {
                 case 404:
                     msg = "NOT_FOUND_ERROR";
                     break;
+                case 412:
                 case 409:
                     msg = "CONFLICT_ERROR";
                     break;

src/ui_ng/src/i18n/lang/en-lang.json

@@ -126,9 +126,9 @@
         "PUBLIC": "Public",
         "PRIVATE": "Private",
         "MAKE": "Make",
-        "NEW_POLICY": "New Policy",
+        "NEW_POLICY": "New Replication Rule",
         "DELETE": "Delete",
-        "MY_PROJECTS": "My Projects",
+        "MY_PROJECTS": "All Projects",
         "PUBLIC_PROJECTS": "Public Projects",
         "PROJECT": "Project",
         "NEW_PROJECT": "New Project",
@@ -149,7 +149,7 @@
     "PROJECT_DETAIL": {
         "REPOSITORIES": "Repositories",
         "REPLICATION": "Replication",
-        "USERS": "Users",
+        "USERS": "Members",
         "LOGS": "Logs",
         "PROJECTS": "Projects"
     },
@@ -198,29 +198,29 @@
         "REPLICATION_RULE": "Replication Rule",
         "NEW_REPLICATION_RULE": "New Replication Rule",
         "ENDPOINTS": "Endpoints",
-        "FILTER_POLICIES_PLACEHOLDER": "Filter Policies",
+        "FILTER_POLICIES_PLACEHOLDER": "Filter Rules",
         "FILTER_JOBS_PLACEHOLDER": "Filter Jobs",
-        "DELETION_TITLE": "Confirm Policy Deletion",
+        "DELETION_TITLE": "Confirm Rule Deletion",
-        "DELETION_SUMMARY": "Do you want to delete policy {{param}}?",
+        "DELETION_SUMMARY": "Do you want to delete rule {{param}}?",
         "FILTER_TARGETS_PLACEHOLDER": "Filter Targets",
-        "DELETION_TITLE_TARGET": "Confirm Target Deletion",
+        "DELETION_TITLE_TARGET": "Confirm Endpoint Deletion",
-        "DELETION_SUMMARY_TARGET": "Do you want to delete target {{param}}?",
+        "DELETION_SUMMARY_TARGET": "Do you want to delete the endpoint {{param}}?",
         "ADD_POLICY": "New Replication Rule",
         "EDIT_POLICY": "Edit Replication Rule",
-        "DELETE_POLICY": "Delete Policy",
+        "DELETE_POLICY": "Delete Replication Rule",
         "TEST_CONNECTION": "Test Connection",
         "TESTING_CONNECTION": "Testing Connection...",
         "TEST_CONNECTION_SUCCESS": "Connection tested successfully.",
-        "TEST_CONNECTION_FAILURE": "Failed to ping target.",
+        "TEST_CONNECTION_FAILURE": "Failed to ping endpoint.",
         "NAME": "Name",
         "PROJECT": "Project",
         "NAME_IS_REQUIRED": "Name is required.",
         "DESCRIPTION": "Description",
         "ENABLE": "Enable",
         "DISABLE": "Disable",
-        "DESTINATION_NAME": "Destination Name",
+        "DESTINATION_NAME": "Endpoint Name",
-        "DESTINATION_NAME_IS_REQUIRED": "Destination name is required.",
+        "DESTINATION_NAME_IS_REQUIRED": "Endpoint name is required.",
-        "NEW_DESTINATION": "New Destination",
+        "NEW_DESTINATION": "New Endpoint",
         "DESTINATION_URL": "Endpoint URL",
         "DESTINATION_URL_IS_REQUIRED": "Endpoint URL is required.",
         "DESTINATION_USERNAME": "Username",
@@ -247,21 +247,21 @@
         "END_TIME": "End Time",
         "LOGS": "Logs",
         "ITEMS": "item(s)",
-        "TOGGLE_ENABLE_TITLE": "Enable Policy",
+        "TOGGLE_ENABLE_TITLE": "Enable Rule",
-        "CONFIRM_TOGGLE_ENABLE_POLICY": "After enabling the replication policy, all repositories under the project will be replicated to the destination registry. Please confirm to continue.",
+        "CONFIRM_TOGGLE_ENABLE_POLICY": "After enabling the replication rule, all repositories under the project will be replicated to the destination registry. Please confirm to continue.",
-        "TOGGLE_DISABLE_TITLE": "Disable Policy",
+        "TOGGLE_DISABLE_TITLE": "Disable Rule",
-        "CONFIRM_TOGGLE_DISABLE_POLICY": "After disabling the policy, all unfinished replication jobs of this policy will be stopped and canceled. Please confirm to continue.",
+        "CONFIRM_TOGGLE_DISABLE_POLICY": "After disabling the rule, all unfinished replication jobs of this rule will be stopped and canceled. Please confirm to continue.",
-        "CREATED_SUCCESS": "Created policy successfully.",
+        "CREATED_SUCCESS": "Created replication rule successfully.",
-        "UPDATED_SUCCESS": "Updated policy successfully.",
+        "UPDATED_SUCCESS": "Updated replication rule successfully.",
-        "DELETED_SUCCESS": "Deleted policy successfully.",
+        "DELETED_SUCCESS": "Deleted replication rule successfully.",
-        "DELETED_FAILED": "Deleted policy failed.",
+        "DELETED_FAILED": "Deleted replication rule failed.",
-        "TOGGLED_SUCCESS": "Toggled policy status successfully."
+        "TOGGLED_SUCCESS": "Toggled replication rule status successfully."
     },
     "DESTINATION": {
         "NEW_ENDPOINT": "New Endpoint",
         "ENDPOINT": "Endpoint",
-        "NAME": "Destination Name",
+        "NAME": "Endpoint Name",
-        "NAME_IS_REQUIRED": "Destination name is required.",
+        "NAME_IS_REQUIRED": "Endpoint name is required.",
         "URL": "Endpoint URL",
         "URL_IS_REQUIRED": "Endpoint URL is required.",
         "USERNAME": "Username",
@@ -272,16 +272,16 @@
         "DELETE": "Delete Endpoint",
         "TESTING_CONNECTION": "Testing Connection...",
         "TEST_CONNECTION_SUCCESS": "Connection tested successfully.",
-        "TEST_CONNECTION_FAILURE": "Failed to ping target.",
+        "TEST_CONNECTION_FAILURE": "Failed to ping endpoint.",
         "CONFLICT_NAME": "Name or endpoint URL already exists.",
         "INVALID_NAME": "Invalid destination name.",
         "FAILED_TO_GET_TARGET": "Failed to get endpoint.",
         "CREATION_TIME": "Creation Time",
         "ITEMS": "item(s)",
-        "CREATED_SUCCESS": "Created destination successfully.",
+        "CREATED_SUCCESS": "Created endpoint successfully.",
-        "UPDATED_SUCCESS": "Updated destination successfully.",
+        "UPDATED_SUCCESS": "Updated endpoint successfully.",
-        "DELETED_SUCCESS": "Deleted destination successfully.",
+        "DELETED_SUCCESS": "Deleted endpoint successfully.",
-        "DELETED_FAILED": "Deleted destination failed."
+        "DELETED_FAILED": "Deleted endpoint failed."
     },
     "REPOSITORY": {
         "COPY_ID": "Copy ID",

src/ui_ng/src/i18n/lang/zh-lang.json

@@ -128,7 +128,7 @@
         "MAKE": "设为",
         "NEW_POLICY": "新建策略",
         "DELETE": "删除",
-        "MY_PROJECTS": "我的项目",
+        "MY_PROJECTS": "所有项目",
         "PUBLIC_PROJECTS": "公开项目",
         "PROJECT": "项目",
         "NEW_PROJECT": "新建项目",
@@ -149,7 +149,7 @@
     "PROJECT_DETAIL": {
         "REPOSITORIES": "镜像仓库",
         "REPLICATION": "复制",
-        "USERS": "用户",
+        "USERS": "成员",
         "LOGS": "日志",
         "PROJECTS": "项目"
     },