How to implement auto-login of users with firebase authentication and Expo?

Question

I am trying to implement auto-login using firebase authentication and React Native (Expo).

I scoured through various documentation and all kinds of methods like onAuthStateChanged() and using Async Storage but I can't get any of them to work.

My current App.js is given below and I use classes on my screens rather than functions. Help is appreciated, please!

import { View } from "react-native";

import { NavigationContainer } from "@react-navigation/native";
import { createNativeStackNavigator } from "@react-navigation/native-stack";

import LoginScreen from "./screens/LoginScreen";
import HomeScreen from "./screens/HomeScreen";
import RedeemScreen from "./screens/RedeemScreen";
import BlogScreen from "./screens/BlogScreen";

const Stack = createNativeStackNavigator();

export default function App() {
  return (
    <View style={{ flex: 1, backgroundColor: "#070707" }}>
      <NavigationContainer>
        <Stack.Navigator initialRouteName={"Login"}>
          <Stack.Screen
            name="Login"
            component={LoginScreen}
            options={{ headerShown: false }}
          />
          <Stack.Screen
            name="Home"
            component={HomeScreen}
            options={{ headerShown: false }}
          />
          <Stack.Screen
            name="Blog"
            component={BlogScreen}
            options={{ headerShown: false }}
          />
          <Stack.Screen
            name="Redeem"
            component={RedeemScreen}
            options={{ headerShown: false }}
          />
        </Stack.Navigator>
      </NavigationContainer>
    </View>
  );
}