Querying subset from angularfire2 - firebase

I need to get a subset from a firebase list. Let's say I have two sets:
set1 = {
dog:true,
cat:true,
snake:true,
bull:true
}
and
set2 = {
dog:true,
cat:true
}
What I need is to get the "in set1, but not in set2", in this case it would return:
setresult = {
snake:true,
bull:true
}
I tried to achieve this with map:
this.setresult = this.af.database.list('/set2/').map((animals) => {
return animals.map((animal) => {
if (auth.uid == _user.$key || af.database.object('set2/' + animal.$key) == null) {}
else {
return af.database.object('set1/' + animal.$key);
}
})
})
But I end up with a list with nulls, and I need only the result set.
Thanks in advance.

You can use the combineLatest operator to compose an observable that emits an object containing the keys/values from set1 that are not in set2:
import * as Rx from "rxjs/Rx";
let set = Rx.Observable.combineLatest(
// Combine the latest values from set1 and set2
// using AngularFire2 object observables.
this.af.database.object('/set1/'),
this.af.database.object('/set2/'),
// Use the operator's project function to emit an
// object containing the required values.
(set1, set2) => {
let result = {};
Object.keys(set1).forEach((key) => {
if (!set2[key]) {
result[key] = set1[key];
}
});
return result;
}
);
set.subscribe((set) => { console.log(set); });

Related

why map with condition return always value

I'm using rxjs map to retrive data in firestore like this:
getArtists(): Observable<DocumentData> {
const users$ = this.firestore.collection('/Users').get()
users$.subscribe((users) => {
users.docs.map(user => user.data().artistName !== "" && user.data().role === 'ARTIST')
});
return users$;
}
but when i'm getting value like this :
this.userService.getArtists().subscribe(
(userDocs) => {
userDocs.docs.map((user) => {
this.artists.push(user.data());
console.log(this.artists)
this.record = this.artists.length;
})
});
it's return always the user when the artistName is equals to "" and role is not equals to 'ARTIST'.
why ?
thank's everybody!
you need to map data in a map operator instead of a subscription and return a value in as a pipe.
Unfortunately, in your code isn't clear what and when you want to filter, why a user is in users.docs when it tend to be a doc.
Please check an example below and consider updating your question with more info.
import {filter, map} from 'rxjs/opreators';
getArtists(): Observable<DocumentData> {
return this.firestore.collection('/Users').get().pipe( // <- use pipe
map(users => {
// here some changes in users if we need.
return users;
}),
),
filter(users => {
returns true; // or false if we don't want to emit this value.
}),
}

get only changed objects from observed array with rxjs

I have an array of objects (not primitives) called "streaks" on my state tree and I want to observe only the changes to that array, not simply emit the entire array every time it changes. When I try this using pairwise() I get two identical arrays every time, even though I thought pairwise() would join the previous version and the current version. Why is pairwise() sending two identical arrays? NOTE streaks[1] and streaks[0] are identical, so _.differenceBy() isn't finding any changes because the two arrays are the same.
import {from} from "rxjs";
import {map, pairwise} from "rxjs/operators";
import * as _ from 'lodash';
const state$ = from(store);
const streaks$ = state$.pipe(
map(state => state.streaks),
// distinctUntilChanged(), <-- i've tried this and nothing is output at all
pairwise(),
map(streaks => {
let diff = _.differenceBy(streaks[0], streaks[1], _.isEqual);
console.log('diff', diff); //<-- this is an empty array
return diff;
})
);
streaks$.subscribe((streaksArray) => {
console.log('STREAKS$ 0', streaksArray); //<-- this is never even hit
} );
I solved this issue by creating an distinctUntilChangedArray operator that uses a self written compareArray function
Create compare array function
const compareArray<T> = (first: T[], second: T[], comparator=: (obj: T, obj2: T) => boolean): boolean {
return (first.length === 0 && second.length === 0)
|| (first.length === second.length && first.every((value, index) => {
return comparator
? comparator(value, second[index])
: JSON.stringify(value) === JSON.stringify(second[index]);
}))
}
Maybe you find a better array comparator. This is just my personal implementation of it
Create distinctUntilChangedArray operator
const distinctUntilChangedArray<T> = (comparator?: (prev: T, curr: T) => boolean): MonoTypeOperatorFunction<T[]> {
return distinctUntilChanged((prev: T[], curr: T[]) => {
return compareArray(first, second, comparator);
}
}
Final usage
interface nonPrimitive {
id: number;
name: string;
}
const nonPrimitiveComparator = (prev: nonPrimitive, curr: nonPrimitive): boolean => {
return prev.id === curr.id && prev.name === curr.name;
}
const source$: Observable<nonPrimitive>;
const distinctedSource$ = source$.pipe(
distinctUntilChangedArray(nonPrimitiveComparator)
);

Quickly finding users by phone number with Firebase backend

I’m working on an app with a Firebase backend. During sign up I would like to let new users see which of their contacts are already on the app to add them as friends. So basically, use phone numbers to match users with contacts.
I am having a big performance headache when querying the database to find users.
Since Firestore does not support OR queries, I run two queries per phone number (one to check national format, the other for international format), and if any returns a document, set that document as the found user:
findUserByPhoneNumber = (number, callback) => {
//utility function to, well, sanitize phone numbers
sanitizeNumber = (str) => {
if (str) {
var num = str.match(/\d/g);
num = num.join("");
return num;
} else {
return null
}
}
var foundUser = null
Promise.all([
usersRef.where('phoneNumbers.nationalFormat', '==', sanitizeNumber(number)).get()
.then(snapshot => {
if (snapshot.docs.length > 0 && snapshot.docs[0].data()) {
// console.log('nationalFormat result: ', snapshot.docs[0]);
foundUser = snapshot.docs[0].data()
}
return foundUser
}),
usersRef.where('phoneNumbers.internationalFormat', '==', sanitizeNumber(number)).get()
.then(snapshot => {
if (snapshot.docs.length > 0 && snapshot.docs[0].data()) {
// console.log('internationalFormat result: ', snapshot.docs[0]);
foundUser = snapshot.docs[0].data()
}
return foundUser
})
])
.then(results => {
res = results.filter(el => { return el != null })
if (results.length > 0) {
callback(res[0])
}
})
}
findUserByPhoneNumber runs for each contact in a loop. When testing on my phone with 205 contacts, the whole process takes about 30 seconds, which is about 29 seconds longer than I would like, especially given the test database has only 8 records...
getContacts = () => {
getCs = () => {
// Declare arrays
const contactsWithAccount = []
const contactsWithNoAccount = []
// Get contacts from user's phone
Contacts.getAll((err, contacts) => {
if (err) throw err
// For each contact, iterate
for (var i = 0; i < contacts.length; i++) {
const item = contacts[i]
if (item.phoneNumbers && item.phoneNumbers.length > 0) {
const phone = item.phoneNumbers[0].number
// If the sanitized phone number is different from the current user's phone number (saved in DB), run the following logic
if (this.state.user.phoneNumbers.nationalFormat != sanitizeNumber(phone)
&& this.state.user.phoneNumbers.internationalFormat != sanitizeNumber(phone)
) {
findUserByPhoneNumber(phone, (fu) => {
contactObject = {
key: item.recordID,
name: item.givenName,
normalizedName: item.givenName.toLowerCase(),
phoneNumber: phone,
user: this.state.user,
hasAccount: null,
friendId: null,
isFriend: null
}
const foundUser = fu
// if found user, push in contactsWithAccount, otherwise push in contactsWithNoAccount
if (foundUser && foundUser._id != this.state.user._id) {
contactObject.hasAccount = true
contactObject.friendId = foundUser._id
if (this.state.user.friends && this.state.user.friends.includes(foundUser._id)) {
contactObject.isFriend = true
}
contactsWithAccount.push(contactObject)
}
else {
contactsWithNoAccount.push(contactObject)
}
// if the two arrays are filled up, run the callback
// NOTE_1: we use the two lengths +1 to account for the current
// user's document that we skip and dont add to any of the arrays
// NOTE_2: this bizare method was the only way to handle the results
// coming in asynchronously
if (contactsWithAccount.length + contactsWithNoAccount.length + 1 == contacts.length) {
console.log('finished');
sortCs(contactsWithAccount, contactsWithNoAccount)
}
})
}
}
}
})
}
// sorts the two arrays alphabetically
sortCs = (withAccount, withNoAccount) => {
compare = (a,b) => {
if (a.name < b.name)
return -1;
if (a.name > b.name)
return 1;
return 0;
}
withAccount.sort(compare)
withNoAccount.sort(compare)
this.setState({ withAccount, withNoAccount })
}
// unleash the monster
getCs(sortCs)
}
I am sure the process could be optimized in various ways. Maybe:
different database structure
bundling all queries into one
better use
of async
starting the process at an earlier step in the signup flow
Whatsapp, HouseParty and a bunch of other apps have this feature in place and it loads instantly. I’m not trying to reach that level of perfection yet but there must be some better way…
Any help/suggestions would be greatly appreciated.

AngularFire2 Firebase Observable never ends (list is empty)

I'm trying to query an empty firebase list. The problem is that the observable method subscribe never finish and I can't show to user that ddbb list is empty.
The function getUserAppointmentsByDate(...) is calling getUserAppointments(...), where this.database.list('/appointment/users/' + user_uid) is an empty firebase list for the input user (user_uid).
how should I manage an empty query to firebase?
thanks in advance!
getUserAppointmentsByDate(user_uid: string, start: string, end: string) {
if (typeof (user_uid) == "undefined" || typeof (start) == "undefined" || typeof (end) == "undefined") {
console.error("invalid argument for getPatientReport");
return;
}
return this.getUserAppointments(user_uid)
.map(
(appointment) => {
return appointment
.filter((appointment) => {
var appointmentStart = new Date(appointment.start);
var startFilter = new Date(start);
var endFilter = new Date(end);
//Filter old, not cancelled and not deleted
return (appointmentStart.getTime() < endFilter.getTime())
&& (appointmentStart.getTime() > startFilter.getTime())
&& (appointment.status != AppointmentStatus.CANCELLED);
});
})
}
getUserAppointments(user_uid: string): any {
return this.database.list('/appointment/users/' + user_uid) //*THIS IS AN EMPTY LIST
.mergeMap((appointments) => {
return Observable.forkJoin(appointments.map(
(appointment) => this.database.object('/appointment/list/' + appointment.$key)
.take(1)))
})
}
As the this.database.list('/appointment/users/' + user_uid) return a empty array. Observable.forkJoin(appointments.map( complete without emit any value (that is the expected way of forkJoin works). In this case, you have two options, handling in the complete function.
.subscribe(
res => console.log('I got values'),
err => console.log('I got errors'),
// do it whatever you want here
() => console.log('I complete with any values')
)
or handle in an if statement:
import { of } from 'rxjs/observable/of';
...
return this.database.list('/appointment/users/' + user_uid)
.mergeMap((appointments) => {
if (appointments.length === 0) return of([]);
return Observable.forkJoin(appointments.map(
(appointment) => this.database.object('/appointment/list/' + appointment.$key)
.take(1)))
})

Flatten/Chain multiple nested firebase Observables

I'm trying to use AngularFire2. I am querying and everything works fine below.
I want to combine all/most of the observables into one:
getTournamentWithRounds(key):Observable<Tournament> {
return this.af.database
.object(`/tournaments/${key}`)
.map(tourney => {
let t = Tournament.fromJson(tourney);
this.af.database.list('players', {
query: {
orderByChild: 'tournament_key',
equalTo: key
}
})
.map(Player.fromJsonList)
.subscribe(ps => { t.players = ps; });
this.af.database.list('rounds', {
query: {
orderByChild: 'tournament_key',
equalTo: key
}
})
.map(Round.fromJsonList)
.subscribe(rs => { t.rounds= rs; })
return t;
})
}
I was wondering if I could join all the observables and get the output with a single subscribe function.
I would like to know when all the initial data has been loaded and perform additional computation in the controller before outputting it to the view.
Also, how could this be extended to include the matches for each round?
My extension to the above code would be:
...
this.af.database.list('rounds', {
query: {
orderByChild: 'tournament_key',
equalTo: key
}
})
.map(rounds => {
return rounds.map((round) => {
let r = Round.fromJson(round);
this.af.database.list('matches', {
query: {
orderByChild: 'round_key',
equalTo: round.$key
}
})
.map(Match.fromJsonList)
.subscribe(matches => { r.matches = matches; })
return r;
})
})
.subscribe(rs => { t.rounds= rs; })
...
You could use the combineLatest operator to combine the players and rounds with the tournament:
getTournamentWithRounds(key): Observable<Tournament> {
return this.af.database
.object(`/tournaments/${key}`)
.combineLatest(
this.af.database.list('players', {
query: {
orderByChild:'tournament_key',
equalTo: key
}
}),
this.af.database.list('rounds', {
query: {
orderByChild:'tournament_key',
equalTo: key
}
})
)
.map(([tourney, players, rounds]) => {
let t = Tournament.fromJson(tourney);
t.players = Player.fromJsonList(players);
t.rounds = Round.fromJsonList(rounds);
return t;
});
}
Whenever any of the observables emits, the latest values will be re-combined and a new Tournament will be emitted.
Extending this to include each round's matches is a little more complicated, as each round's key is needed for the matches query.
The emitted rounds can be mapped to an array of list observables for the matches and forkJoin can be used to join the observables, with the forkJoin selector function being used to combine the matches with the rounds. switchMap is then used to emit the rounds.
getTournamentWithRounds(key): Observable<Tournament> {
return this.af.database
.object(`/tournaments/${key}`)
.combineLatest(
this.af.database.list('players', {
query: {
orderByChild:'tournament_key',
equalTo: key
}
}),
this.af.database.list('rounds', {
query: {
orderByChild:'tournament_key',
equalTo: key
}
})
.switchMap(rounds => {
Observable.forkJoin(
rounds.map(round => this.af.database.list('matches', {
query: {
orderByChild: 'round_key',
equalTo: round.$key
}
}).first()),
(...lists) => rounds.map((round, index) => {
let r = Round.fromJson(round);
r.matches = Match.fromJsonList(lists[index]);
return r;
})
)
})
)
.map(([tourney, players, rounds]) => {
let t = Tournament.fromJson(tourney);
t.players = Player.fromJsonList(players);
t.rounds = rounds;
return t;
});
}

Resources