import React from 'react';
import ReactDOM from 'react-dom/client';
import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
import { RouterProvider } from '@tanstack/react-router';
import { router } from './router';
import { initTheme } from './lib/theme';
import './index.css';

// Apply the persisted theme before first paint so the whole app is themed.
initTheme();

const queryClient = new QueryClient({
  defaultOptions: {
    queries: {
      // Per-query staleTime is tuned later (aggressive for static data). This is
      // just a sane baseline.
      staleTime: 30_000,
      refetchOnWindowFocus: false,
    },
  },
});

ReactDOM.createRoot(document.getElementById('root') as HTMLElement).render(
  <React.StrictMode>
    <QueryClientProvider client={queryClient}>
      <RouterProvider router={router} />
    </QueryClientProvider>
  </React.StrictMode>
);