Step 13.20: Add reactive search by location

client/imports/app/parties/parties-list.component.ts

@@ -35,6 +35,7 @@ export class PartiesListComponent implements OnInit, OnDestroy {
   optionsSub: Subscription;
   partiesSize: number = 0;
   autorunSub: Subscription;
+  location: Subject<string> = new Subject<string>();
 
   constructor(
     private paginationService: PaginationService
@@ -44,8 +45,9 @@ export class PartiesListComponent implements OnInit, OnDestroy {
     this.optionsSub = Observable.combineLatest(
       this.pageSize,
       this.curPage,
-      this.nameOrder
-    ).subscribe(([pageSize, curPage, nameOrder]) => {
+      this.nameOrder,
+      this.location
+    ).subscribe(([pageSize, curPage, nameOrder, location]) => {
       const options: Options = {
         limit: pageSize as number,
         skip: ((curPage as number) - 1) * (pageSize as number),
@@ -58,7 +60,7 @@ export class PartiesListComponent implements OnInit, OnDestroy {
         this.partiesSub.unsubscribe();
       }
 
-      this.partiesSub = MeteorObservable.subscribe('parties', options).subscribe(() => {
+      this.partiesSub = MeteorObservable.subscribe('parties', options, location).subscribe(() => {
         this.parties = Parties.find({}, {
           sort: {
             name: nameOrder
@@ -77,6 +79,7 @@ export class PartiesListComponent implements OnInit, OnDestroy {
     this.pageSize.next(10);
     this.curPage.next(1);
     this.nameOrder.next(1);
+    this.location.next('');
 
     this.autorunSub = MeteorObservable.autorun().subscribe(() => {
       this.partiesSize = Counts.get('numberOfParties');
@@ -89,7 +92,8 @@ export class PartiesListComponent implements OnInit, OnDestroy {
   }
 
   search(value: string): void {
-    this.parties = Parties.find(value ? { location: value } : {}).zone();
+    this.curPage.next(1);
+    this.location.next(value);
   }
 
   onPageChanged(page: number): void {