import React from 'react'
import { Redirect, Route, Switch } from 'react-router-dom'

import './App.css'
import Admin from './Admin'
import Activity from './Activity'
import Activities from './Activities'
import Dashboard from './Dashboard'
import Logout from './User/Logout'
import NavBar from './NavBar'
import NotFound from './Others/NotFound'
import Profile from './User/Profile'
import ProfileEdit from './User/ProfileEdit'
import UserForm from './User/UserForm'
import { isLoggedIn } from '../utils'

export default class App extends React.Component {

  constructor(props) {
    super(props)
    this.props = props
  }

  render() {
    return (
      <div className="App">
        <NavBar />
        <Switch>
          <Route
            exact path="/"
            render={() => (
              isLoggedIn() ? (
                <Dashboard />
              ) : (
                <Redirect to="/login" />
              )
            )}
          />
          <Route
            exact path="/register"
            render={() => (
              isLoggedIn() ? (
                <Redirect to="/" />
              ) : (
                <UserForm
                  formType={'register'}
                />
              )
            )}
          />
          <Route
            exact path="/login"
            render={() => (
              isLoggedIn() ? (
                <Redirect to="/" />
              ) : (
                <UserForm
                  formType={'login'}
                />
              )
            )}
          />
          <Route exact path="/logout" component={Logout} />
          <Route
            exact path="/profile/edit"
            render={() => (
              isLoggedIn() ? (
                <ProfileEdit />
              ) : (
                <UserForm
                  formType={'login'}
                />
              )
            )}
          />
          <Route
            exact path="/profile"
            render={() => (
              isLoggedIn() ? (
                <Profile />
              ) : (
                <UserForm
                  formType={'login'}
                />
              )
            )}
          />
          <Route
            exact path="/activities/history"
            component={Activities}
          />
          <Route path="/activities" component={Activity} />
          <Route path="/admin" component={Admin} />
          <Route component={NotFound} />
        </Switch>
     </div>
    )
  }
}