// Html page
import "file-loader?name=[name].[ext]!../index.html"

// Import default image
import "file-loader?name=img/[name].[ext]!../img/noimage.png"

// Import favicon settings
import "file-loader?name=[name].[ext]!../img/apple-touch-icon.png"
import "file-loader?name=[name].[ext]!../img/favicon-16x16.png"
import "file-loader?name=[name].[ext]!../img/favicon-32x32.png"
import "file-loader?name=[name].[ext]!../img/favicon.ico"
import "file-loader?name=[name].[ext]!../img/safari-pinned-tab.svg"

// Styles
import "../less/app.less"

// React
import React from "react"
import ReactDOM from "react-dom"
import { Provider } from "react-redux"
import { Router, Route, Switch, Redirect } from "react-router-dom"

// Auth
import { ProtectedRoute, AdminRoute } from "./auth"

// Store
import store, { history } from "./store"

// Components
import AdminPanel from "./components/admins/panel"
import Alert from "./components/alerts/alert"
import MovieList from "./components/movies/list"
import MoviesRoute from "./components/movies/route"
import NavBar from "./components/navbar"
import WsHandler from "./components/websocket"
import ShowDetails from "./components/shows/details"
import ShowList from "./components/shows/list"
import ShowsRoute from "./components/shows/route"
import TorrentList from "./components/torrents/list"
import TorrentSearch from "./components/torrents/search"
import UserActivation from "./components/users/activation"
import UserLoginForm from "./components/users/login"
import UserLogout from "./components/users/logout"
import UserProfile from "./components/users/profile"
import UserSignUp from "./components/users/signup"
import UserTokens from "./components/users/tokens"

const App = () => (
  <div>
    <WsHandler />
    <NavBar />
    <Alert />
    <div className="container-fluid">
      <Switch>
        <AdminRoute path="/admin" exact component={AdminPanel} />
        <Route path="/users/profile" exact component={UserProfile} />
        <Route path="/users/tokens" exact component={UserTokens} />
        <Route path="/torrents/list" exact component={TorrentList} />
        <Route path="/torrents/search" exact component={TorrentSearch} />
        <Route path="/torrents/search/:type/:search" exact component={TorrentSearch} />
        <MoviesRoute path="/movies/polochon" exact component={MovieList} />
        <MoviesRoute path="/movies/wishlist" exact component={MovieList} />
        <MoviesRoute path="/movies/search/:search" exact component={MovieList} />
        <MoviesRoute path="/movies/explore/:source/:category" exact component={MovieList} />
        <ShowsRoute path="/shows/polochon" exact component={ShowList} />
        <ShowsRoute path="/shows/wishlist" exact component={ShowList} />
        <ShowsRoute path="/shows/search/:search" exact component={ShowList} />
        <ShowsRoute path="/shows/explore/:source/:category" exact component={ShowList} />
        <ShowsRoute path="/shows/details/:imdbId" exact component={ShowDetails} />
        <Route render={() =>
            <Redirect to="/movies/explore/yts/seeds" />
        }/>
      </Switch>
    </div>
  </div>
);

ReactDOM.render((
  <Provider store={store}>
    <Router history={history}>
      <Switch>
        <Route path="/users/login" exact component={UserLoginForm} />
        <Route path="/users/logout" exact component={UserLogout} />
        <Route path="/users/signup" exact component={UserSignUp} />
        <Route path="/users/activation" exact component={UserActivation} />
        <ProtectedRoute path="*" component={App} />
      </Switch>
    </Router>
  </Provider>
),document.getElementById("app"));