samedi 30 mars 2019

modelling and if/else pattern inside an rxjs observable pipeline

I have an epic where I am listening to an action stream, when an action of 'AUTH_STATUS_CHECKED' occurs switch over to a new observable authState(app.auth()). This new observable tells me if I am authenticated or not.

If the auth observable returns a user then dispatch 'SIGNED_IN' action with the user as the payload.

If a user does not exist then fore off a promise app.auth().signInWithPopup(googleAuthProvider) and when you get the response dispatch 'SIGNED_IN'.

If there are any errors, catch them and let me know in the console.

based on the logic above I have implemented the pipeline below

export const fetchAuthStatus = action$ =>
      action$.pipe(
        ofType('AUTH_STATUS_CHECKED'),
        switchMap(() =>
          authState(app.auth()).pipe(
            map(user =>
              user
                ? { type: 'SIGNED_IN', payload: user }
                : app
                    .auth()
                    .signInWithPopup(googleAuthProvider)
                    .then(user => ({ type: 'SIGNED_IN', payload: user }))
            ),
            catchError(error => console.log('problems signing in'))
          )
        )
      );

It's not working as expected. If there is no user the promise gets fired but it does not wait for the response and the dispatch never gets fired.

I'm clearly new to rxjs and I'm having trouble figuring this out. I've gone through the docs and tried using a tap() and mergeMap() but am getting the same error.

Any guidance would be appreciated.

Aucun commentaire:

Enregistrer un commentaire