// import { useState } from 'react'
// import reactLogo from './assets/react.svg'
// import viteLogo from '/vite.svg'
import './App.css'

// import 'bootstrap/dist/css/bootstrap.min.css' 
// import './assets/css/custom.css' 
// import './assets/scss/custom.scss'
// import 'bootstrap/dist/css/bootstrap.css';
// import 'bootstrap/dist/js/bootstrap.js';
// import './assets/css/custom.css'

import HomePage from './pages/HomePage';
import { QueryClient, QueryClientProvider } from 'react-query';
import Layout from './common/Layout';
import { BrowserRouter, Route, Routes } from 'react-router-dom';
import { Provider as JotaiProvider } from 'jotai';
import Dictionaries from './pages/library/edit/Dictionaries';
import AdminLayout from './common/AdminLayout';
import AnimeTitleCreate from './pages/library/edit/AnimeTitleCreate';
import AnimeTitleDetail from './pages/library/anime/AnimeTitleDetail';
import AnimeTitleEdit from './pages/library/edit/AnimeTitleEdit';
import LoginRegisterPage from './pages/LoginRegisterPage';
import AxiosProvider from './api/user/axiosProvider';
import UserDetailPage from './pages/UserDetailPage';
import AnimeSeasonCreate from "./pages/library/edit/AnimeSeasonCreate.tsx";
import AnimeEpisodeCreate from "./pages/library/edit/AnimeEpisodeCreate.tsx";

function App() {
	//const [count, setCount] = useState(0)
	return (
		<BrowserRouter>
            <JotaiProvider>
				<AxiosProvider>
					<Routes>
						<Route path="/login" element={
							<QueryClientProvider client={new QueryClient()}>
								<LoginRegisterPage />
							</QueryClientProvider>
						} />
						<Route path="/" element={
							<>
								<QueryClientProvider client={new QueryClient()}>
									<Layout />
								</QueryClientProvider>
							</>
							}>
							<Route index element={<HomePage />} />
							<Route path="library">
								<Route path="anime/:id" element={<AnimeTitleDetail />} />
							</Route>
							{/* <Route path="about" element={<About />} /> */}
							{/* <Route path="contact" element={<Contact />} /> */}
							<Route path="account" element={<UserDetailPage />} />
						</Route>
						<Route path="/admin" element={
							<>
								<QueryClientProvider client={new QueryClient()}>
									<AdminLayout />
								</QueryClientProvider>
							</>
							}>
							<Route path='library/dictionaries' element={<Dictionaries />} />
							<Route path='library/anime' element={<AnimeTitleCreate />} />
							<Route path='library/anime/:id/edit' element={<AnimeTitleEdit />} />
							<Route path='library/anime/:titleId/season/' element={<AnimeSeasonCreate />} />
							<Route path='library/anime/:titleId/episode/' element={<AnimeEpisodeCreate />} />
							{/* <Route path="about" element={<About />} /> */}
							{/* <Route path="contact" element={<Contact />} /> */}
						</Route>
						{/* <Route path="/connect" element={<Connect />} /> */}
						{/* <Route path="*" element={<Error />} /> */}
					</Routes>
				</AxiosProvider>
			</JotaiProvider>
        </BrowserRouter>
  	)
}

export default App