import 'bootstrap/dist/css/bootstrap.min.css';
import React from 'react';
import ReactDOM from 'react-dom/client';
import { RouterProvider, createBrowserRouter } from 'react-router-dom';
import App from './App.jsx';
import './index.css';
import ErrorPage from './pages/ErrorPage.jsx';
import MainPage from './pages/MainPage.jsx';
import Chanel from './pages/Chanel.jsx';
import Login from './pages/Login.jsx';
import Register from './pages/Register.jsx';
import Admin from './pages/Admin.jsx';
import Repair from './pages/Repair.jsx';
import Search from './pages/Search.jsx';
import Watch from './pages/Watch.jsx';

const routes = [
  {
    index: true,
    path: '/',
    element: <MainPage />,
    title: 'Главная страница',
  },
  {
    path: '/chanel',
    element: <Chanel />,
    title: 'Вторая страница',
  },
  {
    path: '/login',
    element: <Login />,
    title: 'Третья страница',
  },
  {
    path: '/regist',
    element: <Register />,
    title: 'Четвертая страница',
  },
  {
    path: '/admin',
    element: <Admin />,
  },
  {
    path: '/repair',
    element: <Repair />,
  },
  {
    path: '/search',
    element: <Search />,
  },
  {
    path: '/watch',
    element: <Watch />,
  },
];

const router = createBrowserRouter([
  {
    path: '/',
    element: <App routes={routes} />,
    children: routes,
    errorElement: <ErrorPage />,
  },
]);

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