import React from 'react';
import ReactDOM from 'react-dom/client';
import { BrowserRouter } from 'react-router-dom';
import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
import { Toaster } from 'react-hot-toast';
import { App } from './app/App';
import './index.css';
// Initialize i18next before React renders
import './lib/i18n';
// FE-API-019: Initialize MSW for development if enabled
import { env } from './config/env';

// HMR Force Update: 1765126900

const queryClient = new QueryClient({
  defaultOptions: {
    queries: {
      retry: false,
      refetchOnWindowFocus: false,
    },
  },
});

// FE-API-019: Initialize MSW worker for development
async function enableMocking() {
  if (!env.USE_MSW) {
    return;
  }

  if (import.meta.env.DEV) {
    const { worker } = await import('./mocks/browser');
    
    // Start the worker
    await worker.start({
      onUnhandledRequest: 'bypass', // Don't warn about unhandled requests
      serviceWorker: {
        url: '/mockServiceWorker.js',
      },
    });

    console.log('[MSW] Mock Service Worker started');
  }
}

// Start MSW before rendering the app
enableMocking().then(() => {
  ReactDOM.createRoot(document.getElementById('root')!).render(
    <React.StrictMode>
      <QueryClientProvider client={queryClient}>
        <BrowserRouter
          future={{
            v7_startTransition: true,
            v7_relativeSplatPath: true,
          }}
        >
          <App />
          <Toaster position="top-right" />
        </BrowserRouter>
      </QueryClientProvider>
    </React.StrictMode>,
  );
});
