import { StrictMode } from 'react'
import { createRoot } from 'react-dom/client'
import { createBrowserRouter, RouterProvider } from 'react-router-dom'
import './index.css'
import { Layout } from './components/Layout'
import ErrorPage from './pages/ErrorPage'

const router = createBrowserRouter([
  {
    element: <Layout />,
    errorElement: <ErrorPage />,
    children: [
      {
        path: '/',
        lazy: async () => {
          const { default: Component } = await import('./pages/Home')
          return { Component }
        },
      },
      {
        path: '/obras',
        lazy: async () => {
          const { default: ListagemObras } = await import('./pages/ListagemObras')
          return { Component: () => <ListagemObras variante="obras" /> }
        },
      },
      {
        path: '/atualizacoes',
        lazy: async () => {
          const { default: ListagemObras } = await import('./pages/ListagemObras')
          return { Component: () => <ListagemObras variante="atualizacoes" /> }
        },
      },
      {
        path: '/ranking',
        lazy: async () => {
          const { default: ListagemObras } = await import('./pages/ListagemObras')
          return { Component: () => <ListagemObras variante="ranking" /> }
        },
      },
      {
        path: '/busca',
        lazy: async () => {
          const { default: ListagemObras } = await import('./pages/ListagemObras')
          return { Component: () => <ListagemObras variante="busca" /> }
        },
      },
      {
        path: '/dmca',
        lazy: async () => {
          const { default: Component } = await import('./pages/DMCA')
          return { Component }
        },
      },
      {
        path: '/privacidade',
        lazy: async () => {
          const { default: Component } = await import('./pages/Privacidade')
          return { Component }
        },
      },
      {
        path: '/termos',
        lazy: async () => {
          const { default: Component } = await import('./pages/Termos')
          return { Component }
        },
      },
      {
        path: '/login',
        lazy: async () => {
          const { default: Component } = await import('./pages/Auth')
          return { Component }
        },
      },
      {
        path: '/registro',
        lazy: async () => {
          const { default: Component } = await import('./pages/Auth')
          return { Component }
        },
      },
      {
        path: '/perfil',
        lazy: async () => {
          const { default: Component } = await import('./pages/Perfil')
          return { Component }
        },
      },
      {
        path: '/perfil/:nick',
        lazy: async () => {
          const { default: Component } = await import('./pages/PerfilPublico')
          return { Component }
        },
      },
      {
        path: '/obra/:id',
        lazy: async () => {
          const { default: Component } = await import('./pages/Obra')
          return { Component }
        },
      },
      {
        path: '/capitulo/:id',
        lazy: async () => {
          const { default: Component } = await import('./pages/Capitulo')
          return { Component }
        },
      },
    ],
  },
])

createRoot(document.getElementById('root')!).render(
  <StrictMode>
    <RouterProvider router={router} />
  </StrictMode>,
)