rxfire Ideas

functional-approach.ts

const firestore = firebase.firestore()


const doc$ = (path: string) => {

    return Observable.create(observer => {
        firestore
        .doc(path)
        .onSnapshot({
          next(doc) {
            observer.next(doc);
          }
        });
    });
 }


// Custom Operators

// Maps snapshot to raw data
const data = (opts?: firebase.firestore.SnapshotOptions) => (
  source: Observable<firebase.firestore.DocumentSnapshot>
) =>
  new Observable<firebase.firestore.DocumentData>(observer => {
    return source.subscribe({
      next(snap) {
        observer.next(snap.data());
      }
    });
  });
  
  
  
// Plucks specific properties from the document data, like a client-side projection query
const pick = (props: string[]) => (
  source: Observable<firebase.firestore.DocumentSnapshot>
) =>
  new Observable<firebase.firestore.DocumentData>(observer => {
    return source.subscribe({
      next(snap) {
        const data = snap.data();
        observer.next(_.pick(data, props)); // Using lodash here
      }
    });
  });

usage.ts

import { doc$, update$, pick, data } from 'rxfire';

doc$('animals/elephant')
// Emits full snapshot



doc$('animals/elephant').pipe(data())
// Emits data



doc$('animals/elephant')
      .pipe(
        pick(['imgURL', 'name'])
       )
// Emits data only with projected properties
// { name: 'elephant', imgURL: '...' }



//// Writes ////

// fromPromise
update$(path, data).subscribe()


/// Refs ///