import React, { useEffect } from 'react';
import { Stack } from 'expo-router';
import { StatusBar } from 'expo-status-bar';
import { useAuthStore } from '@store/authStore';

/**
 * Root layout do expo-router.
 * Carrega a sessão armazenada e controla o fluxo auth vs app.
 */
export default function RootLayout(): React.ReactElement | null {
  const { loadStoredSession, isLoading } = useAuthStore();

  useEffect(() => {
    loadStoredSession();
  }, [loadStoredSession]);

  if (isLoading) return null;

  return (
    <>
      <StatusBar style="light" backgroundColor="transparent" translucent />
      <Stack screenOptions={{ headerShown: false, contentStyle: { backgroundColor: '#1E1B18' } }}>
        <Stack.Screen name="(auth)" />
        <Stack.Screen name="(app)" />
      </Stack>
    </>
  );
}