import { StrictMode } from 'react'
import { createRoot, hydrateRoot } from 'react-dom/client'
import { RouterProvider } from 'react-router-dom'
import { router } from './routes/router'
import { applyTheme, loadTheme } from './data/themes'
import '../styles/styles.css'

// Apply the saved theme before first paint to avoid a flash of the default.
applyTheme(loadTheme())

const container = document.getElementById('root')
const app = (
  <StrictMode>
    <RouterProvider router={router} />
  </StrictMode>
)

// Prerendered pages hydrate; the dev server renders from scratch.
if (container.firstElementChild) {
  hydrateRoot(container, app)
} else {
  createRoot(container).render(app)
}