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';

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="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>
  );
};
