// import { createBrowserHistory } from 'history';
import {
  unstable_HistoryRouter as HistoryRouter,
  Route,
  Routes,
} from 'react-router-dom';

import { Error401, Error404 } from '@/errors';
import { AlbumRoutes } from '@/scene/album/AlbumRoutes';
import { ArtistRoutes } from '@/scene/artist/ArtistRoutes';
import { GenderRoutes } from '@/scene/gender/GenderRoutes';
import { HelpPage } from '@/scene/home/HelpPage';
import { HomePage } from '@/scene/home/HomePage';
import { SSORoutes } from '@/scene/sso/SSORoutes';
import { TrackRoutes } from '@/scene/track/TrackRoutes';
import { useHasRight } from '@/service/session';
import { SettingsPage } from './home/SettingsPage';
import { AddPage } from './home/AddPage';
import { OnAirPage } from './onAir/OnAirPage';

export const AppRoutes = () => {
  const { isReadable } = useHasRight('user');
  return (
    // <HistoryRouter
    //   // @ts-expect-error
    //   history={createBrowserHistory({ window })}
    //   basename="/karusic"
    // >
    <Routes>
      {/* Need to keep it in all case, it is the only way to log-in */}
      <Route path="sso/*" element={<SSORoutes />} />
      {isReadable ? (
        <>
          <Route path="/" element={<HomePage />} />
          <Route path="help" element={<HelpPage />} />
          <Route path="settings" element={<SettingsPage />} />
          <Route path="add" element={<AddPage />} />
          <Route path="on-air/*" element={<OnAirPage />} />
          <Route path="artist/*" element={<ArtistRoutes />} />
          <Route path="album/*" element={<AlbumRoutes />} />
          <Route path="gender/*" element={<GenderRoutes />} />
          <Route path="track/*" element={<TrackRoutes />} />
          <Route path="*" element={<Error404 />} />
        </>
      ) : (
        <Route path="*" element={<Error401 />} />
      )}
    </Routes>
    // </HistoryRouter>
  );
};