CODEWITHSUNDEEP
react-nativereduxreact-redux
K.Wu
K.Wu

Reputation: 3633

How to check if user's logged in, in react native using firebase?

Here's what I have so far, I use redux to maintain the login state globally. In my login screen, I'm using action creator to log user in like so...

    // In LoginScreen file
    onLogin = () => {
      this.props.accountLogin({ email, password });
    }

And in actions file, accountLogin is defined as:

    // In auth_action file
    export const accountLogin = ({ email, password }) => {
      firebase.auth().signInWithEmailAndPassword(email, password)
        .then(user => {
          dispatch({ type: LOGIN_SUCCESS, payload: user })});
      });
    };

Then, in reducer file, case LOGIN_SUCCESS is handled like so...

    // In auth_reducer file
    const INITIAL_STATE = {
      // ... Other stuff
      user: null
    };
    export default function (state = INITIAL_STATE, action) {
      // ... Other cases
      // Login Successful case
      case LOGIN_SUCCESS:
        return { ...state, user: action.payload };
        // After this return statement, I now have user's profile info
    };

So my question is, how do I persist user's profile info so that next time user opens the app, they don't have to re-login? I've done some research, and this is what I have:

    // Use autoRehydrate and persistStore in 'redux-persist'
    // In store file
    import { createStore, compose, applyMiddleware } from 'redux';
    import thunk from 'redux-thunk';
    import { autoRehydrate, persistStore } from 'redux-persist';
    import { AsyncStorage } from 'react-native';
    import reducers from '../reducers';

    const store = createStore(
      reducers,
      {},
      compose(
        applyMiddleware(thunk),
        autoRehydrate()
      )
    );

    persistStore(store, { storage: AsyncStorage, whitelist: ['auth'] });

    export default store;

And of course, I did handle REHYDRATE case in my auth_reducer file. But still, it's true that after user reopens the app, I have the user info from last time that user used the app, how can I use this piece of information to continue modify my data in firebase database?

For example, if user reopens the app, and wishes to change his name, how does firebase know this is an authorized user? How to write this changeName function?

Upvotes: 4

Views: 13334

Answers (1)

soutot
soutot

Reputation: 3671

This method helps you with that. Set this in your componentWillMount

firebase.auth().onAuthStateChanged((user) => {
      if (user) {
        console.log('user logged')
      }
   });

More info here: https://firebase.google.com/docs/auth/

Upvotes: 11

Related Questions