App.js

import React, { useState, useEffect } from "react";
import { Text, View, ActivityIndicator } from "react-native";
import { ThemeProvider } from "react-native-rapi-ui";
import { NavigationContainer } from "@react-navigation/native";
import { createStackNavigator } from "@react-navigation/stack";
import { Provider } from "react-native-paper";
import { auth } from "./firebase"; // Import Firebase Auth
import { onAuthStateChanged } from "firebase/auth";

import LoginScreen from "./screens/LoginScreen";
import RegisterScreen from "./screens/RegisterScreen";
import ForgotPassword from "./screens/ForgotPassword";
import HomeScreen from "./screens/HomeScreen";
import AddScreen from "./screens/AddScreen";
import UpdateScreen from "./screens/UpdateScreen";
import AllTransactions from "./screens/AllTransactions";
import SettingsScreen from "./screens/SettingsScreen";

const Stack = createStackNavigator();

export default function App() {
  const [user, setUser] = useState(null);
  const [loading, setLoading] = useState(true);

  useEffect(() => {
    const unsubscribe = onAuthStateChanged(auth, (authenticatedUser) => {
      setTimeout(() => {
        setUser(authenticatedUser);
        setLoading(false); // Finish loading after auth state check + delay
      }, 2000); // **2-second delay**
    });

    return () => unsubscribe(); // Cleanup listener
  }, []);

  if (loading) {
    return (
      <View style={{ flex: 1, justifyContent: "center", alignItems: "center" }}>
        <ActivityIndicator size="large" color="#0000ff" />
        <Text>Setting Things Up...</Text>
      </View>
    );
  }

  return (
    <ThemeProvider>
      <NavigationContainer>
        <Provider>
          <Stack.Navigator>
            {user ? (
              <>
                <Stack.Screen name="HomeScreen" component={HomeScreen} />
                <Stack.Screen name="AddScreen" component={AddScreen} />
                <Stack.Screen name="UpdateScreen" component={UpdateScreen} />
                <Stack.Screen name="AllTransactions" component={AllTransactions} />
                <Stack.Screen name="SettingsScreen" component={SettingsScreen} />
              </>
            ) : (
              <>
                <Stack.Screen name="LoginScreen" component={LoginScreen} />
                <Stack.Screen name="RegisterScreen" component={RegisterScreen} />
                <Stack.Screen name="ForgotPassword" component={ForgotPassword} />
              </>
            )}
          </Stack.Navigator>
        </Provider>
      </NavigationContainer>
    </ThemeProvider>
  );
}