Help with auth flow in ebay style app

#1

Hey guys,

I’m looking to implement a different style of authentication in my app to what I normally use. I typically have the user sign up in a mandatory process on app start up

However with this app, I am building an ebay style app that I want users to be able to search listings without having to first register an account. The problem lies in what’s the best way to go about handling screens in regards to auth state.

I have a drawer navigator with multiple screens with more than half I want to be accessible without logging in. For example, I have this set up which sits inside a StackNavigator with other screens

DrawerNav = DrawerNavigator({
    home: {
         screen: HomeScreen
    },
    Search: {
         screen: AccountScreen
    },
    Profile: {
         screen: ProfileScreen
    },
    Offers: {
         screen: OffersScreen
    },
})

I want the home, search and offers screen to be visible without authorisation, but the profile and another screen to be dynamic based on the current auth state. It’s also possible I may want more screens within the drawer navigator depending on the auth state, but this isn’t definite.

I have thought of lots of different ways to go about this, but I’m getting stuck half way through any of them. Could anyone recommend a good way to go about this as I’m pretty stuck

Thanks

#2

Probably the simplest solution is for e.g. the Profile screen to render its content differently depending on whether the person is logged in.

#3

Thanks for replying ide.

What would you recommend is the best way of checking auth state?

I could use firebase and check if firebase.auth().currentUser != null

or I could use AsyncStorage and set a field with the user state,

Or use firebase’s onAuthStateChanged listeners.

Are any of these methods more favourable than the other?

#4

In firebase the preferred way to check for auth is to use the onAuthStateChanged then update a redux type value, that way if the user signs out at any time you can update the app to reroute to an auth screen.
firebase.auth().currentUser != null is a good way to check before preforming some kind of data transaction. Granted if you run a transaction and you aren’t signed in an error will be returned - so either way works there.
Finally I wouldn’t recommend the AsyncStorage method just because it can get messy. If you are going to use some kind of persistent storage then redux-persist and rehydrate can be a good option.

#5

Thanks bacon for help clearing up some of that for me. I see AsyncStorage everywhere for Auth and didn’t feel it was right approach. I’ll implement my auth flow with the firebase listener and currenUser propertires. Thanks!

1 Like
#6

You might see instances of AsyncStorage being used to store things like the Facebook Auth token, but I think Firebase caches and manages this as credential data. Again, firebase has thought of a lot of prominent use-cases and you should explore these before adding on top of them… But lmao it seems like you’re already doing that, so this is just for future reference :sweat_smile::smile:

closed #7

This topic was automatically closed 28 days after the last reply. New replies are no longer allowed.