// resources/js/VkvApp.tsx
import {HeroUIProvider} from '@heroui/react'
import {useHref, useNavigate, useRoutes} from 'react-router-dom'
import routes from './routes'
import Header from './Header'
import Tail from './Tail'
import AppErrorBoundary from './components/AppErrorBoundary'

export default function VkvApp() {
  const navigate = useNavigate()
  const routeElement = useRoutes(routes)

  return (
    <HeroUIProvider navigate={navigate} useHref={useHref}>
      <div className="flex min-h-screen flex-col mx-auto">
        <Header />
        <main id="content" className="grow">
          <AppErrorBoundary>
            {routeElement}
          </AppErrorBoundary>
        </main>
        <Tail />
      </div>
    </HeroUIProvider>
  )
}