0

I'm using firebase to handle authentication using email&password auth but I also want to store additonal user details to a collection with uid that is generated from email/password auth.

The user gets registered but other details are not being stored to the users collection

Packages -

"@firebase/app": "0.4.10",
"@firebase/auth": "0.11.4",
"@firebase/database": "0.4.7",
"@firebase/firestore": "1.4.4",
"react-redux-firebase": "2.3.0",
"redux-firestore": "0.8.0",
"redux-thunk": "2.3.0"

I'm using redux-thunk to perform user registration asynchronously and then dispatching reducers.

In the below code, I've consoled credentials, firestore, they have the values and chained methods respectively, even the res.user.uid is there but for some reason user gets registered but user's details document doesnt get added to the users collection.

Async Action

export const signup = credentials => {
    return (dispatch, getState, { getFirebase, getFirestore }) => {
        const firebase = getFirebase();
        const firestore = getFirestore();
        firebase
            .auth()
            .createUserWithEmailAndPassword(
                credentials.email,
                credentials.password
            )
            .then(res =>
                firestore
                    .collection("users")
                    .doc(res.user.uid)
                    .set({
                        name: credentials.name,
                        username: credentials.username
                    })
            )
            .then(() => dispatch({ type: SIGNUP_SUCCESS }))
            .catch(err => dispatch({ type: SIGNUP_ERROR, err }));
    };
};

store.js

import { applyMiddleware, createStore, compose } from "redux";
import thunk from "redux-thunk";
import { reduxFirestore, getFirestore } from "redux-firestore";
import { reactReduxFirebase, getFirebase } from "react-redux-firebase";

import reducers from "./reducers/index";

import firebase from "../config/firebase";

const composeEnhancers = window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ || compose;

const store = createStore(
    reducers,
    composeEnhancers(
        applyMiddleware(thunk.withExtraArgument({ getFirebase, getFirestore })),
        reduxFirestore(firebase),
        reactReduxFirebase(firebase)
    )
);

export default store;
prvnbist
  • 431
  • 4
  • 20
  • 1
    Start by adding a `return` in front of firestore...set(...) so that it's part of your promise chain and so that you're waiting on the write before declaring it a success, and so that errors are captured. – Kato Jul 16 '19 at 20:16
  • @Kato Doesn't the whole `dispatch({ type: SIGNUP_SUCCESS })` take care of that? I'm not a redux expert btw, but that was my semi-educated guess. – Frank van Puffelen Jul 17 '19 at 00:22
  • @Kato That shouldn't be the problem since it's returning implicitly anyway. – prvnbist Jul 17 '19 at 11:00

0 Answers0