/**
 * @module main
 * @intent Application entry point — mounts the React root with providers, router, error boundary, and service worker registration.
 */
import { StrictMode } from 'react';
// Import Inter variable font - supports all weights from 100-900
import '@fontsource-variable/inter';
import './i18n';
import { createRoot } from 'react-dom/client';
import { BrowserRouter } from 'react-router-dom';
import './index.css';
import { AppRoutes } from './routes';
import { AuthProvider } from './contexts/AuthContext';
import { ToasterProvider } from './components/Toaster';
import { ConfirmDialogProvider, PromptDialogProvider } from './lib/ui-feedback';
import { ApiBridge } from './components/ApiBridge';
import { QuerySync } from './components/QuerySync';
import { ScrollToTop } from './components/ScrollToTop';
import { ErrorBoundary } from './components/ErrorBoundary';
import { initTheme, initDarkFromStorage, initDensity, initCustomPrimary } from './lib/theme';
import { trackBundleSize } from './lib/performance';
import { CommandPaletteProvider } from './components/CommandPalette';
import { QueryClientProvider } from '@tanstack/react-query';
import { ReactQueryDevtools } from '@tanstack/react-query-devtools';
import { queryClient } from './lib/queryClient';
import { ShortcutsProvider } from './components/Shortcuts';
import { ShortcutsHelp } from './components/ShortcutsHelp';
import { NavigationShortcuts } from './components/NavigationShortcuts';
import { ThemeProvider } from './providers/theme-provider';
import { RouteProvider } from './providers/router-provider';
import { BrandProvider } from './contexts/BrandContext';
import { StoreProvider } from './contexts/StoreContext';
import { DevToolbar } from './components/DevToolbar';
import { ImpersonationBanner } from './components/ImpersonationBanner';
import { ImpersonationGuard } from './components/ImpersonationGuard';
// PWA components disabled
// import { DevSwBanner } from './components/DevSwBanner';
// import { OfflineIndicator } from './components/OfflineIndicator';
// import { InstallPrompt } from './components/InstallPrompt';
// import { UpdateNotification } from './components/UpdateNotification';
// import { TestDevTools } from './components/TestDevTools'; // Can be removed now that DevTools work

// Unregister any existing service workers (PWA disabled)
if ('serviceWorker' in navigator) {
  navigator.serviceWorker
    .getRegistrations()
    .then((regs) => {
      regs.forEach((r) => r.unregister());
      if (regs.length > 0) {
        console.log('Unregistered existing service workers');
      }
    })
    .catch(() => {
      /* ignore */
    });
}

const el = document.getElementById('root');
if (el) {
  // Initialize theme from localStorage before render to avoid FOUC
  try {
    initTheme();
    initDarkFromStorage();
    initDensity();
    initCustomPrimary();
  } catch {
    /* ignore */
  }

  // Track bundle size in development
  if (import.meta.env.DEV) {
    setTimeout(() => trackBundleSize(), 1000);
  }
  // Always render the React app now that we have proper setup handling
  const root = createRoot(el);
  root.render(
    <StrictMode>
      <BrowserRouter>
        <RouteProvider>
          <QueryClientProvider client={queryClient}>
            <AuthProvider>
              <StoreProvider>
                <ThemeProvider>
                  <BrandProvider>
                  <ToasterProvider>
                    <ConfirmDialogProvider>
                      <PromptDialogProvider>
                        <CommandPaletteProvider>
                          <ShortcutsProvider>
                            <ApiBridge />
                            <QuerySync />
                            <ScrollToTop />
                            <ImpersonationBanner />
                            <ImpersonationGuard />
                            <ErrorBoundary>
                              <ShortcutsHelp />
                              <NavigationShortcuts />
                              <AppRoutes />
                              <DevToolbar />
                              {/* PWA components disabled */}
                              {/* <TestDevTools /> */}
                              {import.meta.env.DEV && (
                                <ReactQueryDevtools
                                  initialIsOpen={false}
                                  buttonPosition="bottom-right"
                                  position="bottom"
                                />
                              )}
                            </ErrorBoundary>
                          </ShortcutsProvider>
                        </CommandPaletteProvider>
                      </PromptDialogProvider>
                    </ConfirmDialogProvider>
                    </ToasterProvider>
                  </BrandProvider>
                </ThemeProvider>
              </StoreProvider>
            </AuthProvider>
          </QueryClientProvider>
        </RouteProvider>
      </BrowserRouter>
    </StrictMode>,
  );
  // Remove static loading spinner once React kicked off
  try {
    document.querySelector('.loading-container')?.remove();
  } catch {
    /* ignore */
  }
}

// Devtools are lazily rendered inside the provider in development only