Fix app list paging and filtering

- Remove caching from page in favour of doing
  server side filtering with paging. Filter
  on server side is only with name as address
  doesn't play nice search(makes it impossible to
  filter names).
- Initially tried to add better tests for apps
  but that was a failure. Will get done with #336.
- Fixes #296

Resolves issue with search field being disabled on empty result

Author: jvalkeal

ui/src/app/apps/apps.component.html

@@ -24,7 +24,7 @@ <h1 [ngBusy]="busy">Apps</h1>
   <span class="hidden-xs">Bulk Import Applications</span>
 </button>
 <label *ngIf="appRegistrations" class="control">
-  <input type="text" class="input" placeholder="Filter items" [(ngModel)]="appRegistrations.filter" [disabled]="!appRegistrations || appRegistrations.items.length === 0">
+  <input type="text" class="input" placeholder="Filter items" [(ngModel)]="appRegistrations.filter" >
 </label>
 <button id="refreshAppRegistrationsButton" type="button" (click)="loadAppRegistrations(true)"
         class="btn btn-default"
@@ -44,7 +44,7 @@ <h1 [ngBusy]="busy">Apps</h1>
     </tr>
   </thead>
   <tbody>
-  <tr *ngFor="let item of appRegistrations.items | searchFilter: appRegistrations.filter | paginate: appRegistrations.getPaginationInstance(); index as i">
+  <tr *ngFor="let item of appRegistrations.items | paginate: appRegistrations.getPaginationInstance(); index as i">
     <td><input type="checkbox" [(ngModel)]="item.isSelected"  /></td>
     <td>{{item.name}}</td>
     <td>{{item.type}}</td>

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

@@ -56,7 +56,7 @@ export class AppsComponent implements OnInit {
    * @param reload
    */
   public loadAppRegistrations(reload: boolean) {
-    this.busy = this.appsService.getApps(reload).subscribe(
+    this.busy = this.appsService.getApps(reload, this.getFilter()).subscribe(
       data => {
         if (!this.appRegistrations) {
           this.appRegistrations = data;
@@ -128,7 +128,7 @@ 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.busy = this.appsService.getApps(true).subscribe(
+        this.busy = this.appsService.getApps(true, this.getFilter()).subscribe(
           appRegistrations => {}
         );
       },
@@ -154,7 +154,7 @@ 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.busy = this.appsService.getApps(true).subscribe(
+        this.busy = this.appsService.getApps(true, this.getFilter()).subscribe(
           appRegistrationsResult => {}
         );
       }
@@ -202,4 +202,12 @@ export class AppsComponent implements OnInit {
     this.appsService.appRegistrations.pageNumber = page - 1;
     this.loadAppRegistrations(true);
   }
+
+  private getFilter(): string {
+    let search: string;
+    if (this.appRegistrations) {
+      search = this.appRegistrations.filter;
+    }
+    return search;
+  }
 }

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

@@ -32,7 +32,7 @@ export class AppsService {
     console.log('constructing');
   }
 
-  getApps(reload?: boolean): Observable<Page<AppRegistration>> {
+  getApps(reload?: boolean, search?: string): Observable<Page<AppRegistration>> {
     console.log(`Get apps - reload ${reload}`, this.appRegistrations);
     if (!this.appRegistrations || reload) {
       if (!this.appRegistrations) {
@@ -42,7 +42,7 @@ export class AppsService {
       this.remotelyLoaded = true;
 
       return this.sharedAppsService.getApps(
-        new PageRequest(this.appRegistrations.pageNumber, this.appRegistrations.pageSize))
+        new PageRequest(this.appRegistrations.pageNumber, this.appRegistrations.pageSize), undefined, search)
           .map(page => {
             this.appRegistrations.update(page);
             return this.appRegistrations;

ui/src/app/shared/services/shared-apps.service.ts

@@ -23,13 +23,16 @@ export class SharedAppsService {
   /**
    * Returns a paged list of {@link AppRegistrations}s.
    */
-  getApps(pageRequest: PageRequest, type?: ApplicationType): Observable<Page<AppRegistration>> {
+  getApps(pageRequest: PageRequest, type?: ApplicationType, search?: string): Observable<Page<AppRegistration>> {
       const params = HttpUtils.getPaginationParams(pageRequest.page, pageRequest.size);
       const requestOptionsArgs: RequestOptionsArgs = HttpUtils.getDefaultRequestOptions();
 
       if (type) {
         params.append('type', ApplicationType[type]);
       }
+      if (search) {
+        params.append('search', search);
+      }
       requestOptionsArgs.search = params;
       return this.http.get(SharedAppsService.appsUrl, requestOptionsArgs)
                       .map(this.extractData.bind(this))