import 'react-native-gesture-handler';
import React from 'react';
import { StatusBar } from 'react-native';
import { GestureHandlerRootView } from 'react-native-gesture-handler';
import { SafeAreaProvider } from 'react-native-safe-area-context';
import { Provider } from 'react-redux';

import { store } from './src/app/store';
import { RootNavigator } from './src/navigation/RootNavigator';
import { ThemeProvider } from './src/theme';
import { ToastHost } from './src/components/ToastHost';
import { useAppBootstrap } from './src/hooks/useAppBootstrap';

const AppShell = () => {
  useAppBootstrap();

  return (
    <>
      <StatusBar barStyle="light-content" translucent backgroundColor="transparent" />
      <RootNavigator />
      <ToastHost />
    </>
  );
};

export default function App() {
  return (
    <GestureHandlerRootView style={{ flex: 1 }}>
      <SafeAreaProvider>
        <Provider store={store}>
          <ThemeProvider>
            <AppShell />
          </ThemeProvider>
        </Provider>
      </SafeAreaProvider>
    </GestureHandlerRootView>
  );
}