import { StrictMode } from 'react'
import { createRoot } from 'react-dom/client'
import './index.css'
import App from './App.tsx'
import { BrowserRouter } from "react-router-dom"
import { QueryClientProvider } from "@tanstack/react-query"
import { queryClient } from "@/app/query-client"
import { Toaster } from "@/components/ui/toast"
import { ErrorBoundary } from "@/components/ErrorBoundary"
import { initSentry } from "@/lib/sentry"
import "@/lib/error-tracker" // Initialize global error handlers

// Initialize Sentry
initSentry()

createRoot(document.getElementById('root')!).render(
  <StrictMode>
    <ErrorBoundary>
      <QueryClientProvider client={queryClient}>
        <BrowserRouter>
          <App />
          <Toaster />
        </BrowserRouter>
      </QueryClientProvider>
    </ErrorBoundary>
  </StrictMode>,
)