gh-298 Fix Page Count incorrect on Apps tab after delete

* Provide doc comments for all methods of the `AppsComponent`
* Fix Busy indicator issue + improve error handling
* Rebase + code review changes

Author: ghillert

ui/src/app/about/about-details.component.ts

@@ -34,6 +34,9 @@ export class AboutDetailsComponent implements OnInit {
       data => {
         this.dataflowVersionInfo = data;
         this.toastyService.success('About details data loaded.');
+      },
+      error => {
+        this.toastyService.error(error);
       }
     );
   }

ui/src/app/about/about.component.ts

@@ -30,6 +30,9 @@ export class AboutComponent implements OnInit {
       data => {
         this.dataflowVersionInfo = data;
         this.toastyService.success('About data loaded.');
+      },
+      error => {
+        this.toastyService.error(error);
       }
     );
   }

ui/src/app/apps/app-details/app-details.component.ts

@@ -22,7 +22,7 @@ export class AppDetailsComponent implements OnInit {
 
   public detailedAppRegistration: DetailedAppRegistration;
 
-  busy: Subscription[] = [];
+  busy: Subscription;
 
   constructor(
     private route: ActivatedRoute,
@@ -36,17 +36,16 @@ export class AppDetailsComponent implements OnInit {
     console.log(this.appsService.appRegistrations);
 
     this.route.params.subscribe(params => {
-       const appName: string = params['appName'];
-       const appType: ApplicationType = params['appType'] as ApplicationType;
-
-       console.log(`Retrieving app registration details for ${appName} (${appType}).`);
-       this.busy.push(this.appsService.getAppInfo(appType, appName).subscribe(data => {
-          this.detailedAppRegistration = data;
-        },
-        error => {
-          this.toastyService.error(error);
-        })
-      );
+      const appName: string = params['appName'];
+      const appType: ApplicationType = params['appType'] as ApplicationType;
+
+      console.log(`Retrieving app registration details for ${appName} (${appType}).`);
+      this.busy = this.appsService.getAppInfo(appType, appName).subscribe(data => {
+        this.detailedAppRegistration = data;
+      },
+      error => {
+        this.toastyService.error(error);
+      });
     });
   }
 

ui/src/app/apps/apps-bulk-import.component.ts

@@ -19,7 +19,7 @@ export class AppsBulkImportComponent implements OnInit, OnChanges {
   public model = new AppRegistrationImport(false, [], '');
 
   apps: any;
-  busy: Subscription[] = [];
+  busy: Subscription;
 
   contents: any;
   uriPattern = '^([a-z0-9-]+:\/\/)([\\w\\.:-]+)(\/[\\w\\.:-]+)*$';
@@ -86,19 +86,17 @@ export class AppsBulkImportComponent implements OnInit, OnChanges {
           console.log('Importing apps using textarea values:\n' + this.model.appsProperties + ' (force: ' + this.model.force + ')');
       }
 
-      const observable = this.appsService.bulkImportApps(this.model).subscribe(
+      this.busy = this.appsService.bulkImportApps(this.model).subscribe(
         data => {
-        console.log(data);
-        this.toastyService.success('Apps Imported.');
-        const reloadAppsObservable = this.appsService.getApps(true).subscribe(
-          appRegistrations => {
-            console.log('Back to about page ...');
-            this.router.navigate(['apps']);
-          }
-        );
-        this.busy.push(reloadAppsObservable);
-      }
+          console.log(data);
+          this.toastyService.success('Apps Imported.');
+          this.busy = this.appsService.getApps(true).subscribe(
+            appRegistrations => {
+              console.log('Back to about page ...');
+              this.router.navigate(['apps']);
+            }
+          );
+        }
       );
-      this.busy.push(observable);
   }
 }

ui/src/app/apps/apps-register/apps-register.component.ts

@@ -29,7 +29,7 @@ export class AppsRegisterComponent implements OnInit, OnChanges {
 
   public model = [new AppRegistration()];
 
-  busy: Subscription[] = [];
+  busy: Subscription;
 
   contents: any;
   uriPattern = '^([a-z0-9-]+:\/\/)([\\w\\.:-]+)(\/[\\w\\.:-]+)*$';
@@ -66,21 +66,20 @@ export class AppsRegisterComponent implements OnInit, OnChanges {
    */
   register() {
     console.log(`Register ${this.model.length} app(s).`);
-    this.busy.push(this.appsService.registerMultipleApps(this.model).subscribe(
+    this.busy = this.appsService.registerMultipleApps(this.model).subscribe(
       data => {
         this.toastyService.success(`${data.length} App(s) registered.`);
-        const reloadAppsObservable = this.appsService.getApps(true).subscribe(
+        this.busy = this.appsService.getApps(true).subscribe(
           appRegistrations => {
             console.log('Back to apps page ...');
             this.router.navigate(['apps']);
           }
         );
-        this.busy.push(reloadAppsObservable);
       },
       error => {
         this.toastyService.error(error);
       }
-    ));
+    );
   }
 
   /**

ui/src/app/apps/apps.component.ts

@@ -10,6 +10,13 @@ import { ToastyService } from 'ng2-toasty';
 
 import { ModalDirective } from 'ngx-bootstrap/modal';
 
+/**
+ * Main entry point to the Apps Module. Provides
+ * a paginated list of {@link AppRegistration}s and
+ * also provides operation to unregister {@link AppRegistration}s.
+ *
+ * @author Gunnar Hillert
+ */
 @Component({
   selector: 'app-apps',
   templateUrl: './apps.component.html'
@@ -35,10 +42,19 @@ export class AppsComponent implements OnInit {
     private router: Router ) {
     }
 
+  /**
+   * As soon as the page loads we retrieve a list
+   * of {@link AppRegistration}s.
+   */
   ngOnInit() {
     this.loadAppRegistrations(false);
   }
 
+  /**
+   * Load a paginated list of {@link AppRegistration}s.
+   *
+   * @param reload
+   */
   public loadAppRegistrations(reload: boolean) {
     this.busy = this.appsService.getApps(reload).subscribe(
       data => {
@@ -53,28 +69,53 @@ export class AppsComponent implements OnInit {
     );
   }
 
+  /**
+   * Navigate to the page in order to register a new
+   * {@link AppRegistration}.
+   */
   registerApps() {
     this.router.navigate(['apps/register-apps']);
   }
 
+  /**
+   * Starts the unregistration process of a single {@link AppRegistration}
+   * by opening a confirmation modal dialog.
+   *
+   * @param appRegistration
+   * @param index
+   */
   unregisterSingleApp(appRegistration: AppRegistration, index: number) {
     console.log(`Unregister single app ${appRegistration.name} (Index: ${index})`);
     this.appRegistrationToUnregister = appRegistration;
     this.unregisterSingleAppModal.show();
   }
 
+  /**
+   * Starts the unregistration process of multiple {@link AppRegistration}s
+   * by opening a confirmation modal dialog.
+   *
+   * @param appRegistrations An array of AppRegistrations to unregister
+   */
   unregisterMultipleApps(appRegistrations: AppRegistration[]) {
     this.appRegistrationsToUnregister = appRegistrations.filter(item => item.isSelected);
     console.log(`Unregister ${this.appRegistrationsToUnregister.length} app(s).`, this.appRegistrationsToUnregister);
     this.unregisterMultipleAppsModal.show();
   }
 
-
+  /**
+   * Navigate to the page that allows for the bulk import of {@link AppRegistration}s.
+   */
   bulkImportApps() {
     console.log('Go to Bulk Import page ...');
     this.router.navigate(['apps/bulk-import-apps']);
   }
 
+  /**
+   * Completes the unregistration step for a single {@link AppRegistration}.
+   * Closes the open modal dialog.
+   *
+   * @param appRegistration The AppRegistration to unregister
+   */
   public proceedToUnregisterSingleAppRegistration(appRegistration: AppRegistration): void {
     console.log('Proceeding to unregister application...', appRegistration);
 
@@ -86,31 +127,65 @@ export class AppsComponent implements OnInit {
 
         if (this.appsService.appRegistrations.items.length === 0 && this.appsService.appRegistrations.pageNumber > 0) {
           this.appRegistrations.pageNumber = this.appRegistrations.pageNumber - 1;
-          this.loadAppRegistrations(true);
         }
+        this.busy = this.appsService.getApps(true).subscribe(
+          appRegistrations => {}
+        );
       },
       error => {
         this.toastyService.error(error);
       }
     );
   }
 
+  /**
+   * Completes the unregistration step for multiple {@link AppRegistration}s.
+   * Closes the open modal dialog.
+   *
+   * @param appRegistrations The array of AppRegistrations to unregister
+   */
   public proceedToUnregisterMultipleAppRegistrations(appRegistrations: AppRegistration[]): void {
     console.log(`Proceeding to unregister ${appRegistrations.length} application(s).`, appRegistrations);
-    for (const appRegistrationToUnregister of appRegistrations) {
-      this.proceedToUnregisterSingleAppRegistration(appRegistrationToUnregister);
-    }
+    const subscription = this.appsService.unregisterMultipleApps(appRegistrations).subscribe(
+      data => {
+        console.log(data);
+        this.toastyService.success(`${data.length} app(s) unregistered.`);
+
+        if (this.appsService.appRegistrations.items.length === 0 && this.appsService.appRegistrations.pageNumber > 0) {
+          this.appRegistrations.pageNumber = this.appRegistrations.pageNumber - 1;
+        }
+        this.busy = this.appsService.getApps(true).subscribe(
+          appRegistrationsResult => {}
+        );
+      }
+    );
+    this.busy = subscription;
+
     this.unregisterMultipleAppsModal.hide();
   }
 
+  /**
+   * Close the confirmation modal dialog for
+   * unregistering a single {@link AppRegistration}.
+   */
   public cancelUnregisterSingleApp() {
     this.unregisterSingleAppModal.hide();
   }
 
+  /**
+   * Close the confirmation modal dialog for
+   * unregistering multiple {@link AppRegistration}s.
+   */
   public cancelUnregisterMultipleApps() {
     this.unregisterMultipleAppsModal.hide();
   }
 
+  /**
+   * Navigate to the page that provides a detail view for the
+   * passed-in {@link AppRegistration}.
+   *
+   * @param appRegistration
+   */
   public viewDetails(appRegistration: AppRegistration) {
     this.router.navigate(['apps/' + appRegistration.type + '/' +  appRegistration.name]);
   }
@@ -128,8 +203,3 @@ export class AppsComponent implements OnInit {
     this.loadAppRegistrations(true);
   }
 }
-
-
-
-
-

ui/src/app/apps/apps.service.ts

@@ -102,6 +102,14 @@ export class AppsService {
 
   }
 
+  unregisterMultipleApps(appRegs: AppRegistration[]): Observable<Response[]> {
+    const observables: Observable<Response>[] = [];
+    for (const appReg of appRegs) {
+      observables.push(this.unregisterApp(appReg));
+    }
+    return Observable.forkJoin(observables);
+  }
+
   registerMultipleApps(appRegs: AppRegistration[]): Observable<Response[]> {
     const observables: Observable<Response>[] = [];
     for (const appReg of appRegs) {

ui/src/app/shared/model/error-handler.ts

@@ -9,19 +9,25 @@ export class ErrorHandler {
      * @returns {any} Exception to be thrown by the Observable
      */
     public handleError(error: Response | any) {
-
         let errMsg = '';
-
         if (error instanceof Response) {
-            const body = error.json() || '';
-            let isFirst = true;
-            for (const bodyElement of body) {
-                if (!isFirst) {
-                    errMsg += '\n';
-                } else {
-                    isFirst = false;
+            let body;
+            try {
+              body = error.json() || '';
+            } catch (e) {
+              console.log('Unparsable json', error);
+              errMsg = `${error.text()} (Status code: ${error.status})`;
+            }
+            if (body) {
+                let isFirst = true;
+                for (const bodyElement of body) {
+                    if (!isFirst) {
+                        errMsg += '\n';
+                    } else {
+                        isFirst = false;
+                    }
+                    errMsg += bodyElement.message;
                 }
-                errMsg += bodyElement.message;
             }
         } else {
             errMsg = error.message ? error.message : error.toString();