I am having a strange issue with expo-router. It’s likely me being stupid, but I’ve exhausted all possibilities at this point.
My expo app is set up with the following structure:
app:
--(tabs) // protected routes
----(home)
----(profile)
----(etc)
--welcome
--login
--signUp
--_layout
--index
The root _layout file renders a stack, and then I use router.replace(‘(home)’) (from within _layout) on a successful login to redirect the user to the .index file in the (home) folder (i.e., the protected route). At this point, the navigation stack should reset so the user cannot go back to login / welcome / signUp until they logout.
On a logout, I use router.replace(‘welcome’) to return the user to the ‘welcome’ screen, where they cannot access the protected (tabs) routes.
However, no matter what I try to do, whenever I login, unless I refresh the app, I can swipe left from the edge of the screen on iOS from my home page and return to the welcome page. (This is not even the previous page I was on before login, since I go from login -> router.replace(‘(home)’)). Why would I be able to return to ‘welcome’ on a swipe back from (home)/index?
I have no idea why this is happening, and I have tried everything from disabling gestures on home screen, rendering entirely different stacks conditionally based on user.auth status, etc. etc. etc.
Any ideas why I am able to swipe back to ‘welcome’ from ‘(home)/index’ even after a login?
In case it’s relevant, the below code is the useEffect hook I use on authstatechanged:
useEffect(() => {
const unsubAuth = onAuthStateChanged(firebaseAuth, (firebaseUser) => {
if (firebaseUser) {
handleUserLogin(firebaseUser);
} else {
setAuth(null);
router.replace('welcome')
}
});
return () => unsubAuth();
}, []);
const handleUserLogin = async (firebaseUser) => {
console.log("Logging in user");
const docRef = doc(db, 'users', firebaseUser.uid);
// Fetch user data from firestore
console.log("Fetching initial user data");
const docSnap = await getDoc(docRef);
if (docSnap.exists) {
updateUserDetails(firebaseUser, docSnap.data());
await registerForPushNotificationsAsync(firebaseUser.uid);
}
router.replace('(home)');
I use router.replace(‘(home)’) which should reset the whole navigation stack and take the user to the index file in the home folder (i.e., the protected route). At this point, they should not ever be able to return to the root screens (welcome, login, signup) until logout, at which point I use router.replace(‘welcome’) to return the user to the welcome screen.
4