Permalink
Browse files

Step 10.5: Implement the search bar logic with RxJS

  • Loading branch information...
dotansimha authored and darkbasic committed Jan 24, 2017
1 parent 8d775f3 commit 5782b82b48d7a9ecaf9e1fe6712764a520de14f1
Showing with 24 additions and 5 deletions.
  1. +24 −5 src/pages/chats/new-chat.ts
@@ -4,13 +4,14 @@ import { User } from 'api/models';
import { AlertController, ViewController } from 'ionic-angular';
import { MeteorObservable } from 'meteor-rxjs';
import { _ } from 'meteor/underscore';
import { Observable, Subscription } from 'rxjs';
import { Observable, Subscription, BehaviorSubject } from 'rxjs';
@Component({
selector: 'new-chat',
templateUrl: 'new-chat.html'
})
export class NewChatComponent implements OnInit {
searchPattern: BehaviorSubject<any>;
senderId: string;
users: Observable<User[]>;
usersSubscription: Subscription;
@@ -20,10 +21,28 @@ export class NewChatComponent implements OnInit {
private viewCtrl: ViewController
) {
this.senderId = Meteor.userId();
this.searchPattern = new BehaviorSubject(undefined);
}
ngOnInit() {
this.loadUsers();
this.observeSearchBar();
}
updateSubscription(newValue) {
this.searchPattern.next(newValue);
}
observeSearchBar(): void {
this.searchPattern.asObservable()
// Prevents the search bar from being spammed
.debounce(() => Observable.timer(1000))
.forEach(() => {
if (this.usersSubscription) {
this.usersSubscription.unsubscribe();
}
this.usersSubscription = this.subscribeUsers();
});
}
addChat(user): void {
@@ -39,12 +58,12 @@ export class NewChatComponent implements OnInit {
});
}
loadUsers(): void {
subscribeUsers(): Subscription {
// Fetch all users matching search pattern
const subscription = MeteorObservable.subscribe('users');
const subscription = MeteorObservable.subscribe('users', this.searchPattern.getValue());
const autorun = MeteorObservable.autorun();
Observable.merge(subscription, autorun).subscribe(() => {
return Observable.merge(subscription, autorun).subscribe(() => {
this.users = this.findUsers();
});
}

0 comments on commit 5782b82

Please sign in to comment.