import { AuthProvider } from '@/components/AuthProvider';
import QueryProvider from '@/components/QueryProvider';
import { ThemeProvider } from '@/components/ThemeContext';
import { useNotifications } from '@/hooks/useNotifications';
import i18n from '@/i18n/i18n';
import { ProfileDataProvider } from '@/screens/profile/lib/ProfileDataContext';
import { Stack } from 'expo-router';
import { StatusBar } from 'expo-status-bar';
import { I18nextProvider } from 'react-i18next';
import { View } from 'react-native';
import 'react-native-reanimated';
import { useSafeAreaInsets } from 'react-native-safe-area-context';

function AppContent() {
  useNotifications();
  const insets = useSafeAreaInsets();

  return (
    <>
      {/* iOS status bar fon */}
      <View
        style={{
          height: insets.top,
          backgroundColor: '#000',
        }}
      />

      {/* StatusBar */}
      <StatusBar
        style="light"
        backgroundColor="#000" // Android
      />

      <Stack screenOptions={{ headerShown: false }} />
    </>
  );
}
export default function RootLayout() {
  return (
    <I18nextProvider i18n={i18n}>
      <QueryProvider>
        <ThemeProvider>
          <ProfileDataProvider>
            <AuthProvider>
              <AppContent />
            </AuthProvider>
          </ProfileDataProvider>
        </ThemeProvider>
      </QueryProvider>
    </I18nextProvider>
  );
}