import 'react-native-reanimated';
import { ApolloProvider } from '@apollo/client';
import { Navigation } from 'navigation';
import { ProfileProvider, SessionProvider, SettingsProvider, ThemeProvider } from 'context';
import { useAppConfiguration } from 'hooks';
import { useSession } from 'hooks/session';
import AppLoading from 'expo-app-loading';
import { SafeAreaProvider } from 'react-native-safe-area-context';
import { Alert } from 'components';

export function App() {
  const { loading, apolloClient } = useAppConfiguration();
  const { loadingSession } = useSession();

  if (loadingSession || loading) {
    return <AppLoading />;
  }

  return (
    <ThemeProvider>
      <SafeAreaProvider>
        <ApolloProvider client={apolloClient}>
          <SessionProvider>
            <ProfileProvider>
              <SettingsProvider>
                <Alert />
                <Navigation />
              </SettingsProvider>
            </ProfileProvider>
          </SessionProvider>
        </ApolloProvider>
      </SafeAreaProvider>
    </ThemeProvider>
  );
}