import React from 'react';
import { Provider } from 'react-redux';
import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
import AppRoutes from './routes';
import { store } from './store/store';
import { initializeAuthPersistence } from './services/authService';
import AuthInitializer from './features/auth/AuthInitializer';

// Initialize the QueryClient
const queryClient = new QueryClient();

// Initialize Firebase Auth persistence
initializeAuthPersistence();

/**
 * Root Application Component.
 * Wraps the app with Redux Provider, React Query Provider, and AuthInitializer.
 * AuthInitializer ensures auth state is restored from persistence before routes are rendered.
 */
const App: React.FC = () => {
  return (
    <Provider store={store}>
      <QueryClientProvider client={queryClient}>
        <AuthInitializer>
          <AppRoutes />
        </AuthInitializer>
      </QueryClientProvider>
    </Provider>
  );
};

export default App;