Adding Pagination Loader

Issue-ID: CCSDK-2433
Signed-off-by: Ahmedeldeeb50 <ahmed.eldeeb.ext@orange.com>
Change-Id: I335ee8fb72c51f303183108aa36887fa0b65cf62

2 files changed, 9 insertions, 3 deletions

diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/packages/packages-dashboard/package-list/package-list.component.html b/cds-ui/designer-client/src/app/modules/feature-modules/packages/packages-dashboard/package-list/package-list.component.html
index f5588bc43..35ca1e2c9 100644
--- a/cds-ui/designer-client/src/app/modules/feature-modules/packages/packages-dashboard/package-list/package-list.component.html
+++ b/cds-ui/designer-client/src/app/modules/feature-modules/packages/packages-dashboard/package-list/package-list.component.html
@@ -15,6 +15,7 @@
                     <a href="#" role="button" aria-pressed="true" class="btn-import-package float"><i
                             class="icon-import-blue" aria-hidden="true"></i>Import Package
                     </a>
+                    <ngx-ui-loader></ngx-ui-loader>
                 </div>
             </div>
         </div>
diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/packages/packages-dashboard/package-pagination/package-pagination.component.ts b/cds-ui/designer-client/src/app/modules/feature-modules/packages/packages-dashboard/package-pagination/package-pagination.component.ts
index c242b7e72..4360062ad 100644
--- a/cds-ui/designer-client/src/app/modules/feature-modules/packages/packages-dashboard/package-pagination/package-pagination.component.ts
+++ b/cds-ui/designer-client/src/app/modules/feature-modules/packages/packages-dashboard/package-pagination/package-pagination.component.ts
@@ -1,5 +1,6 @@
-import {Component, OnInit} from '@angular/core';
-import {PackagesStore} from '../../packages.store';
+import { Component, OnInit } from '@angular/core';
+import { PackagesStore } from '../../packages.store';
+import { NgxUiLoaderService } from 'ngx-ui-loader';
 
 @Component({
     selector: 'app-package-pagination',
@@ -12,7 +13,10 @@ export class PackagePaginationComponent implements OnInit {
     pageSize: number;
     previousPage: number;
 
-    constructor(private packagesStore: PackagesStore) {
+    constructor(
+        private packagesStore: PackagesStore,
+        private ngxLoader: NgxUiLoaderService
+    ) {
         this.pageSize = packagesStore.pageSize;
 
         this.packagesStore.state$
@@ -32,6 +36,7 @@ export class PackagePaginationComponent implements OnInit {
             console.log('page change to first...', page);
         }
         if (this.previousPage !== page) {
+            this.ngxLoader.start(); // start master loader
             this.packagesStore.getPage(page - 1, this.packagesStore.pageSize);
             this.previousPage = page;
         }