React Native + Firebase - How to navigate to login screen after log-out?

I want to set up authentication in my app, so I'm using firebase (I'm new to Firebase and authentication in react native in general).

When I open the app, for some reason it is already logged in, and displays AppStack, instead of AuthStack which is supposed to be the LoginScreen. When I run this code inside my AppStack on a component:

onPress={() => {firebase.auth().signOut().then(function() {  console.log('Signed Out');}, function(error) {  console.error('Sign Out Error', error);});}}>

it successfully logs 'Signed Out', but it doesn't switch screens.

I know the problem lies in my state variable, isLoggedIn, but I don't know how to fix it.

So this is my app.js, would really appreciate any feedback on how to make this work.

import * as React from "react";...import * as firebase from 'firebase';var firebaseConfig = {    ...};// Initialize Firebasefirebase.initializeApp(firebaseConfig);const Stack = createStackNavigator();const Tab = createBottomTabNavigator();function AuthStack() {    return(<Stack.Navigator><Stack.Screen name="Login" component={LoginScreen} options={{ headerShown: false }} /></Stack.Navigator>)}function AppStack() {    return (<Tab.Navigator        screenOptions={({ route }) => ({            tabBarIcon: ({ focused, color, size }) => {                if (route.name === 'Order') {                    return (<IconWithBadge                            name={focused ? 'ios-book' : 'ios-book'}                            size={size}                            color={color}                        />                    );                } else if (route.name === 'Map') {                    return (<Ionicons                            name={focused ? 'md-globe' : 'md-globe'}                            size={size}                            color={color}                        />                    );                } else if (route.name === 'Profile') {                    return (<Ionicons                            name={focused ? 'md-contact' : 'md-contact'}                            size={size}                            color={color}                        />                    )                } else if (route.name === 'Notifications') {                    return (<Ionicons                            name={focused ? 'ios-notifications-outline' : 'ios-notifications-outline'}                            size={size}                            color={color}                        />                    )                }            },        })}        tabBarOptions={{            activeTintColor: 'orange',            inactiveTintColor: 'gray',        }}><Tab.Screen name="Order" component={OrderScreen} /><Tab.Screen name="Map" component={MapScreen} /><Tab.Screen name="Profile" component={ProfileScreen} /><Tab.Screen name="Notifications" component={Notifications} /></Tab.Navigator>)}export default class App extends React.Component {    state = {        isLoggedIn: firebase.auth().onAuthStateChanged(user => { return user}),    }    render() {    return(<NavigationContainer>            { this.state.isLoggedIn ? (<AppStack />) : (<AuthStack />) }</NavigationContainer>    )}}function Notifications() {    return (<View style={{ flex: 1, justifyContent: 'center', alignItems: 'center' }}><Text>Notifications</Text></View>    );}