import React from "react"
import ReactDOM from "react-dom/client"
import { RouterProvider } from "react-router-dom"
import { QueryClient, QueryClientProvider } from "@tanstack/react-query"
import { Toaster } from "@/components/ui/sonner"
import { PlatformProvider } from "@/hooks/usePlatform"
import { MobileClass } from "@/hooks/useIsMobile"
import { ThemeProvider } from "@/store/themeStore"
import { router } from "@/router"
import "./index.css"

const queryClient = new QueryClient()

ReactDOM.createRoot(document.getElementById("root") as HTMLElement).render(
  <React.StrictMode>
    <QueryClientProvider client={queryClient}>
      <ThemeProvider />
      <MobileClass />
      <PlatformProvider>
        <RouterProvider router={router} />
        <Toaster />
      </PlatformProvider>
    </QueryClientProvider>
  </React.StrictMode>
)
