diff --git a/src/ui_ng/lib/src/list-replication-rule/list-replication-rule.component.html.ts b/src/ui_ng/lib/src/list-replication-rule/list-replication-rule.component.html.ts
index 82a8d219f..2609d09b7 100644
--- a/src/ui_ng/lib/src/list-replication-rule/list-replication-rule.component.html.ts
+++ b/src/ui_ng/lib/src/list-replication-rule/list-replication-rule.component.html.ts
@@ -1,12 +1,12 @@
 export const LIST_REPLICATION_RULE_TEMPLATE: string = `
 <div style="padding-bottom: 15px;">
-<clr-datagrid [clrDgLoading]="loading"  [(clrDgSelected)]="selectedRow" (clrDgSelectedChange)="selectedChange()">
+<clr-datagrid [clrDgLoading]="loading"  [(clrDgSingleSelected)]="selectedRow" [clDgRowSelection]="true">
     <clr-dg-action-bar style="height:24px;">
         <div class="btn-group" *ngIf="opereateAvailable || isSystemAdmin">
             <button type="button" class="btn btn-sm btn-secondary" (click)="openModal()">{{'REPLICATION.NEW_REPLICATION_RULE' | translate}}</button>
-            <button type="button" class="btn btn-sm btn-secondary" [disabled]="selectedRow.length !== 1" (click)="editRule(selectedRow)">{{'REPLICATION.EDIT_POLICY' | translate}}</button>
-            <button type="button" class="btn btn-sm btn-secondary" [disabled]="selectedRow.length == 0" (click)="deleteRule(selectedRow)">{{'REPLICATION.DELETE_POLICY' | translate}}</button>
-            <button type="button" class="btn btn-sm btn-secondary" [disabled]="selectedRow.length == 0" (click)="replicateRule(selectedRow)">{{'REPLICATION.REPLICATE' | translate}}</button>
+            <button type="button" class="btn btn-sm btn-secondary" [disabled]="!selectedRow" (click)="editRule(selectedRow)">{{'REPLICATION.EDIT_POLICY' | translate}}</button>
+            <button type="button" class="btn btn-sm btn-secondary" [disabled]="!selectedRow" (click)="deleteRule(selectedRow)">{{'REPLICATION.DELETE_POLICY' | translate}}</button>
+            <button type="button" class="btn btn-sm btn-secondary" [disabled]="!selectedRow" (click)="replicateRule(selectedRow)">{{'REPLICATION.REPLICATE' | translate}}</button>
         </div>
     </clr-dg-action-bar>
     <clr-dg-column [clrDgField]="'name'">{{'REPLICATION.NAME' | translate}}</clr-dg-column>
diff --git a/src/ui_ng/lib/src/list-replication-rule/list-replication-rule.component.ts b/src/ui_ng/lib/src/list-replication-rule/list-replication-rule.component.ts
index 05526f08b..2a25f777b 100644
--- a/src/ui_ng/lib/src/list-replication-rule/list-replication-rule.component.ts
+++ b/src/ui_ng/lib/src/list-replication-rule/list-replication-rule.component.ts
@@ -69,14 +69,13 @@ export class ListReplicationRuleComponent implements OnInit, OnChanges {
   @Output() redirect = new EventEmitter<ReplicationRule>();
   @Output() openNewRule = new EventEmitter<any>();
   @Output() replicateManual = new EventEmitter<ReplicationRule[]>();
-  @Output() hasJobs = new EventEmitter<boolean>();
 
   projectScope: boolean = false;
 
   rules: ReplicationRule[];
   changedRules: ReplicationRule[];
   ruleName: string;
-  canDeleteRuleList: boolean[] = [];
+  canDeleteRule: boolean;
 
   selectedRow: ReplicationRule[] = [];
   batchDelectionInfos: BatchInfo[] = [];
@@ -125,7 +124,7 @@ export class ListReplicationRuleComponent implements OnInit, OnChanges {
 
   retrieveRules(ruleName: string = ''): void {
     this.loading = true;
-    this.selectedRow = [];
+    this.selectedRow = null;
     toPromise<ReplicationRule[]>(this.replicationService
       .getReplicationRules(this.projectId, ruleName))
       .then(rules => {
@@ -185,19 +184,11 @@ export class ListReplicationRuleComponent implements OnInit, OnChanges {
     }
   }
 
-  selectedChange(): void {
-    if (this.selectedRow.length !== 0) {
-      this.hasJobs.emit(false);
-    }
-    let hnd = setInterval(() => this.ref.markForCheck(), 200);
-    setTimeout(() => clearInterval(hnd), 2000);
-  }
 
   selectRule(rule: ReplicationRule): void {
     this.selectedId = rule.id || '';
-    this.selectedRow = [];
+    this.selectedRow = null;
     this.selectOne.emit(rule);
-    this.hasJobs.emit(true);
   }
 
   redirectTo(rule: ReplicationRule): void {
@@ -208,8 +199,8 @@ export class ListReplicationRuleComponent implements OnInit, OnChanges {
     this.openNewRule.emit();
   }
 
-  editRule(rules: ReplicationRule[]) {
-    this.editOne.emit(rules[0]);
+  editRule(rule: ReplicationRule) {
+    this.editOne.emit(rule);
   }
 
   toggleRule(rule: ReplicationRule) {
@@ -225,7 +216,7 @@ export class ListReplicationRuleComponent implements OnInit, OnChanges {
 
   jobList(id: string | number): Promise<void> {
     let ruleData: ReplicationJobItem[];
-    this.canDeleteRuleList = [];
+    this.canDeleteRule = true;
     let count: number = 0;
     return toPromise<ReplicationJob>(this.replicationService
         .getJobs(id))
@@ -238,62 +229,50 @@ export class ListReplicationRuleComponent implements OnInit, OnChanges {
               }
             });
           }
-          let canDeleteRule: boolean = count > 0 ? false : true;
-          this.canDeleteRuleList.push(canDeleteRule);
+          this.canDeleteRule = count > 0 ? false : true;
         })
         .catch(error => this.errorHandler.error(error));
   }
 
-  deleteRule(rules: ReplicationRule[]) {
-    if (rules && rules.length) {
-      let nameArr: string[] = [];
+  deleteRule(rule: ReplicationRule) {
+    if (rule) {
       this.batchDelectionInfos = [];
-      rules.forEach(data => {
-        nameArr.push(data.name);
-        let initBatchMessage = new BatchInfo();
-        initBatchMessage.name = data.name;
-        this.batchDelectionInfos.push(initBatchMessage);
-      });
+      let initBatchMessage = new BatchInfo();
+      initBatchMessage.name = rule.name;
+      this.batchDelectionInfos.push(initBatchMessage);
       let deletionMessage = new ConfirmationMessage(
           'REPLICATION.DELETION_TITLE',
           'REPLICATION.DELETION_SUMMARY',
-          nameArr.join(',') || '',
-          rules,
+          rule.name,
+          rule,
           ConfirmationTargets.POLICY,
           ConfirmationButtons.DELETE_CANCEL);
       this.deletionConfirmDialog.open(deletionMessage);
     }
   }
-    deleteOpe(rules: ReplicationRule[]) {
-      if (rules && rules.length) {
-        let promiseLists: any[] = [];
-        let promiseJobLists: any[] = [];
-        rules.forEach(rule => {
-          promiseJobLists.push(this.jobList(rule.id));
-        })
-
-        Promise.all(promiseJobLists).then(items => {
-          this.canDeleteRuleList.forEach((item, index) => {
-            if (!item) {
-              let findedList = this.batchDelectionInfos.find(data => data.name === rules[index].name);
-              Observable.forkJoin(this.translateService.get('BATCH.DELETED_FAILURE'),
-                  this.translateService.get('REPLICATION.DELETION_SUMMARY_FAILURE')).subscribe(res => {
-                findedList = BathInfoChanges(findedList, res[0], false, true, res[1]);
-              });
-            } else {
-              promiseLists.push(this.delOperate(+rules[index].id, rules[index].name));
-            }
+  deleteOpe(rule: ReplicationRule) {
+    if (rule) {
+      let promiseLists: any[] = [];
+      Promise.all([this.jobList(rule.id)]).then(items => {
+        if (!this.canDeleteRule) {
+          let findedList = this.batchDelectionInfos.find(data => data.name === rule.name);
+          Observable.forkJoin(this.translateService.get('BATCH.DELETED_FAILURE'),
+              this.translateService.get('REPLICATION.DELETION_SUMMARY_FAILURE')).subscribe(res => {
+            findedList = BathInfoChanges(findedList, res[0], false, true, res[1]);
           });
+        } else {
+          promiseLists.push(this.delOperate(+rule.id, rule.name));
+        }
 
-          Promise.all(promiseLists).then(item => {
-            this.selectedRow = [];
-            this.reload.emit(true);
-            let hnd = setInterval(() => this.ref.markForCheck(), 200);
-            setTimeout(() => clearInterval(hnd), 2000);
-          });
+        Promise.all(promiseLists).then(item => {
+          this.selectedRow = null;
+          this.reload.emit(true);
+          let hnd = setInterval(() => this.ref.markForCheck(), 200);
+          setTimeout(() => clearInterval(hnd), 2000);
         });
-      }
+      });
     }
+  }
 
     delOperate(ruleId: number, name: string) {
       let findedList = this.batchDelectionInfos.find(data => data.name === name);
diff --git a/src/ui_ng/lib/src/replication/replication.component.html.ts b/src/ui_ng/lib/src/replication/replication.component.html.ts
index 011924a7c..cc6f68274 100644
--- a/src/ui_ng/lib/src/replication/replication.component.html.ts
+++ b/src/ui_ng/lib/src/replication/replication.component.html.ts
@@ -11,9 +11,9 @@ export const REPLICATION_TEMPLATE: string = `
     </div>
     </div>
     <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
-      <hbr-list-replication-rule #listReplicationRule [readonly]="readonly" [projectId]="projectId" [isSystemAdmin]="isSystemAdmin"  (replicateManual)=replicateManualRule($event) (hasJobs)="hasJobList($event)" (selectOne)="selectOneRule($event)" (openNewRule)="openModal()" (editOne)="openEditRule($event)" (reload)="reloadRules($event)" [loading]="loading" [withReplicationJob]="withReplicationJob" (redirect)="customRedirect($event)"></hbr-list-replication-rule>
+      <hbr-list-replication-rule #listReplicationRule [readonly]="readonly" [projectId]="projectId" [isSystemAdmin]="isSystemAdmin"  (replicateManual)=replicateManualRule($event) (selectOne)="selectOneRule($event)" (openNewRule)="openModal()" (editOne)="openEditRule($event)" (reload)="reloadRules($event)" [loading]="loading" [withReplicationJob]="withReplicationJob" (redirect)="customRedirect($event)"></hbr-list-replication-rule>
     </div>
-    <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12"  [hidden]="!hasJobs" style="padding-left:0px;">
+    <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12" style="padding-left:0px;">
     <div *ngIf="withReplicationJob" class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
       <div class="row flex-items-xs-between" style="height:60px;">
         <h5 class="flex-items-xs-bottom option-left-down" style="margin-left: 14px;">{{'REPLICATION.REPLICATION_JOBS' | translate}}</h5>
diff --git a/src/ui_ng/lib/src/replication/replication.component.ts b/src/ui_ng/lib/src/replication/replication.component.ts
index feb17a6f4..e0a677bc4 100644
--- a/src/ui_ng/lib/src/replication/replication.component.ts
+++ b/src/ui_ng/lib/src/replication/replication.component.ts
@@ -107,7 +107,6 @@ export class ReplicationComponent implements OnInit, OnDestroy {
 
   changedRules: ReplicationRule[];
   initSelectedId: number | string;
-  hasJobs: boolean;
 
   rules: ReplicationRule[];
   loading: boolean;
@@ -271,21 +270,17 @@ export class ReplicationComponent implements OnInit, OnDestroy {
     }
   }
 
-  replicateManualRule(rules: ReplicationRule[]) {
-    if (rules && rules.length) {
-      let nameArr: string[] = [];
+  replicateManualRule(rule: ReplicationRule) {
+    if (rule) {
       this.batchDelectionInfos = [];
-      rules.forEach(rule => {
-        nameArr.push(rule.name);
         let initBatchMessage = new BatchInfo ();
         initBatchMessage.name = rule.name;
         this.batchDelectionInfos.push(initBatchMessage);
-      });
       let replicationMessage = new ConfirmationMessage(
           'REPLICATION.REPLICATION_TITLE',
           'REPLICATION.REPLICATION_SUMMARY',
-          nameArr.join(', ') || '',
-          rules,
+          rule.name,
+          rule,
           ConfirmationTargets.TARGET,
           ConfirmationButtons.REPLICATE_CANCEL);
       this.replicationConfirmDialog.open(replicationMessage);
@@ -296,15 +291,11 @@ export class ReplicationComponent implements OnInit, OnDestroy {
     if (message &&
         message.source === ConfirmationTargets.TARGET &&
         message.state === ConfirmationState.CONFIRMED) {
-      let rules: Endpoint[] = message.data;
-      if (rules && rules.length) {
-        let promiseLists: any[] = [];
-        rules.forEach(rule => {
-          this.replicationOperate(+rule.id, rule.name);
-        })
-        Promise.all(promiseLists).then((item) => {
-          this.listReplicationRule.retrieveRules();
-          this.refreshJobs();
+      let rule: ReplicationRule = message.data;
+
+      if (rule) {
+        Promise.all([this.replicationOperate(+rule.id, rule.name)]).then((item) => {
+          this.selectOneRule(rule);
         });
       }
     }
@@ -384,12 +375,6 @@ export class ReplicationComponent implements OnInit, OnDestroy {
     this.listReplicationRule.retrieveRules();
   }
 
-  hasJobList(hasJob: boolean): void {
-    this.hasJobs = hasJob;
-    if (this.hasJobs) {
-      this.refreshJobs();
-    }
-  }
 
   refreshJobs() {
     this.search.repoName = "";
diff --git a/src/ui_ng/package.json b/src/ui_ng/package.json
index 71f800640..dbba99693 100644
--- a/src/ui_ng/package.json
+++ b/src/ui_ng/package.json
@@ -31,7 +31,7 @@
         "clarity-icons": "^0.10.17",
         "clarity-ui": "^0.10.17",
         "core-js": "^2.4.1",
-        "harbor-ui": "0.6.28",
+        "harbor-ui": "0.6.29",
         "intl": "^1.2.5",
         "mutationobserver-shim": "^0.3.2",
         "ngx-cookie": "^1.0.0",