Skip to content

Commit

Permalink
finished firestore testing
Browse files Browse the repository at this point in the history
  • Loading branch information
srinivasayush committed Mar 28, 2021
1 parent 9942261 commit 8a7fa6a
Show file tree
Hide file tree
Showing 7 changed files with 97 additions and 37 deletions.
20 changes: 12 additions & 8 deletions react-providerx/src/observableProvider/autoDispose.ts
Original file line number Diff line number Diff line change
Expand Up @@ -2,11 +2,12 @@ import { BehaviorSubject, from, Observable, Subscription } from "rxjs";

export class AutoDisposeObservableProvider<T> {
behaviorSubject$: BehaviorSubject<T> | BehaviorSubject<null>
observableCreator: () => (Observable<T> | null)
observable$?: (Observable<T> | null)
observableCreator: () => Observable<T>
_observable$: Observable<T>

constructor(observableCreator: () => (Observable<T> | null)) {
constructor(observableCreator: () => Observable<T>) {
this.observableCreator = observableCreator
this._observable$ = this.observableCreator()
this.behaviorSubject$ = new BehaviorSubject(null)
this._compute()
}
Expand All @@ -15,6 +16,10 @@ export class AutoDisposeObservableProvider<T> {
return this.behaviorSubject$.value
}

get observable() {
return this._observable$
}

static fromPromise<S>(promise: () => Promise<S>): AutoDisposeObservableProvider<S> {
return new AutoDisposeObservableProvider<S>(() => (from(promise()) as any))
}
Expand All @@ -26,24 +31,23 @@ export class AutoDisposeObservableProvider<T> {
}

subscribe<T>(subscribeCallback: (param: T) => void): Subscription {
if(this.observable$ === null || this.observable$ === undefined) {
if(this._observable$ === null || this._observable$ === undefined) {
this._compute()
}
return (this.behaviorSubject$.asObservable() as any).subscribe(subscribeCallback)
}

_compute() {
this.observable$ = this.observableCreator()
if(this.observable$ === null) {
if(this._observable$ === null) {
throw 'observableCreator cannot return null. It must return an instance of Observable'
}
this.observable$.subscribe((val: T) => {
this._observable$.subscribe((val: T) => {
this.behaviorSubject$.next(val as any)
})
}

_reset() {
this.observable$ = null
this._observable$ = this.observableCreator()
this.behaviorSubject$ = new BehaviorSubject(null)
}

Expand Down
4 changes: 0 additions & 4 deletions react-providerx/src/observableProvider/exporter.ts

This file was deleted.

25 changes: 15 additions & 10 deletions react-providerx/src/observableProvider/index.ts
Original file line number Diff line number Diff line change
@@ -1,25 +1,30 @@
import { BehaviorSubject, from, Observable, Subscription } from 'rxjs'
import { AutoDisposeObservableProvider } from './exporter'
import { AutoDisposeObservableProvider } from './autoDispose'


export class ObservableProvider<T> {
behaviorSubject$: BehaviorSubject<T> | BehaviorSubject<null>
observableCreator: () => (Observable<T> | null)
observable$?: (Observable<T> | null)
observableCreator: () => Observable<T>
_observable$: Observable<T>

constructor(observableCreator: () => (Observable<T> | null)) {
constructor(observableCreator: () => Observable<T>) {
this.observableCreator = observableCreator
this._observable$ = this.observableCreator()
this.behaviorSubject$ = new BehaviorSubject(null)
this._compute()
}

static autoDispose<S>(observableCreator: () => (Observable<S> | null)) {
static autoDispose<S>(observableCreator: () => Observable<S>) {
return new AutoDisposeObservableProvider<S>(observableCreator);
}

get value() {
return this.behaviorSubject$.value
}

get observable() {
return this._observable$
}

static fromPromise<S>(promise: () => Promise<S>): ObservableProvider<S> {
return new ObservableProvider<S>(() => (from(promise()) as any))
Expand All @@ -32,27 +37,27 @@ export class ObservableProvider<T> {
}

subscribe<T>(subscribeCallback: (param: T) => void): Subscription {
if(this.observable$ === null || this.observable$ === undefined) {
if(this._observable$ === null || this._observable$ === undefined) {
this._compute()
}
return (this.behaviorSubject$.asObservable() as any).subscribe(subscribeCallback)
}

_compute() {
this.observable$ = this.observableCreator()
if(this.observable$ === null) {
if(this._observable$ === null) {
throw 'observableCreator cannot return null. It must return an instance of Observable'
}
this.observable$.subscribe((val: T) => {
this._observable$.subscribe((val: T) => {
this.behaviorSubject$.next(val as any)
})
}

_reset() {
this.observable$ = null
this._observable$ = this.observableCreator()
this.behaviorSubject$ = new BehaviorSubject(null)
}

registerUnsubscribe() {

}
}
34 changes: 27 additions & 7 deletions tests/react-providerx-test-app/src/pages/HomePage/homePage.tsx
Original file line number Diff line number Diff line change
@@ -1,20 +1,40 @@
import { useProvider } from "react-providerx";
import { refresh, useProvider } from "react-providerx";
import { signOut } from "../../services/auth";
import { authStateProvider$ } from "../../shared/authState";
import { userDataPromiseProvider$ } from "../../shared/userData";

const SubComponent: React.FC = () => {
const { isLoading, data: userData } = useProvider(userDataPromiseProvider$)
if(isLoading) {
return <div className="App">
Loading...
</div>
}
return (
<div className="App">
{(userData as any).email}
</div>
);
}

export const HomePage: React.FC = () => {
const { isLoading, data: user } = useProvider(authStateProvider$)
const { isLoading, data: userData } = useProvider(userDataPromiseProvider$)
if(isLoading) {
return <div className="App">
Loading...
</div>
}
return (
<div className="App">
{(user as any).displayName}
<button onClick={signOut}>
Click to Sign Out
</button>
{(userData as any).email}
<div className="col">
<button onClick={() => refresh(userDataPromiseProvider$)}>
Click to Refresh User Data
</button>
<button onClick={signOut}>
Click to Sign Out
</button>
</div>
<SubComponent />
</div>
);
}
17 changes: 15 additions & 2 deletions tests/react-providerx-test-app/src/services/auth.ts
Original file line number Diff line number Diff line change
@@ -1,8 +1,21 @@
import { auth, googleAuthProvider } from "../utils/firebase"
import { auth, db, googleAuthProvider } from "../utils/firebase"

export const signInWithGoogle = async () => {
const credential = await auth.signInWithPopup(googleAuthProvider)
return credential.user
const user = credential.user
if(user === null) {
return null
}
const userDocSnapshot = await db.collection('users').doc(user.uid).get()
if(!userDocSnapshot.exists) {
await db.collection('users').doc(user.uid).set({
uid: user.uid,
email: user.email,
displayName: user.displayName,
photoURL: user.photoURL,
})
}
return user
}

export const signOut = async () => {
Expand Down
8 changes: 2 additions & 6 deletions tests/react-providerx-test-app/src/shared/authState.ts
Original file line number Diff line number Diff line change
@@ -1,14 +1,10 @@
import { ObservableProvider } from "react-providerx";
import { authState } from 'rxfire/auth'
import { map, tap } from 'rxjs/operators'
import { map } from 'rxjs/operators'
import { auth } from "../utils/firebase";

export const authStateProvider$ = new ObservableProvider(() => {
return authState(auth).pipe(
map(u => u === null ? 'not-logged-in': u),
tap(result => {
console.log('the value of result is')
console.log(result)
})
map(u => u === null ? 'not-logged-in': u)
)
})
26 changes: 26 additions & 0 deletions tests/react-providerx-test-app/src/shared/userData.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,26 @@
import { ObservableProvider } from "react-providerx";
import { of } from "rxjs";
import { doc } from 'rxfire/firestore';
import { map, switchMap, tap } from "rxjs/operators";
import { db } from "../utils/firebase";
import { authStateProvider$ } from "./authState";

export const userDataPromiseProvider$ = new ObservableProvider(() => {
const userDataObservable = authStateProvider$.observable.pipe(
switchMap(result => {
if(result === null || result === 'not-logged-in') {
return of(null)
}
else {
return doc(db.doc(`users/${result.uid}`)).pipe(
map(ds => ds.data()),
tap(userData => {
console.log('Got userData: ')
console.log(userData)
})
)
}
})
)
return userDataObservable
})

0 comments on commit 8a7fa6a

Please sign in to comment.