import React from "react";
import { BrowserRouter as Router, Route, Switch, Redirect } from "react-router-dom";
import * as createHistory from "history";
import { connect } from "react-redux";
import { actionFullLogin } from "../actions/actionFullLogin";
import { actionFullRegister } from "../actions/actionFullRegister";
import { LoginForm } from "../pages/LoginForm";
import { FormReg } from "../pages/FormReg";
import { Main } from "../pages/Main";
import { Home } from "../pages/WorkPage";
import { Cabinet } from "../pages/Cabinet";
import ConnectFormSearch from "../pages/Search";
import CProjects from "../pages/Projects";
import ConnectedProject from "../pages/Project";

const history = createHistory.createBrowserHistory();

const ConnectLoginForm = connect(null, {onLogin:actionFullLogin}) (LoginForm);

const ConnectFormReg = connect(null, {FormReg:actionFullRegister}) (FormReg);

const Routs = ({token}) => {
    return (
        <div className="App">
          <Router history = {history}>
            {token && <Switch>
                <Redirect from="/login" to="/work" />
                <Redirect from="/reg" to="/work" />
                <Route exact path='/work' component={Home} />
                <Route path='/cabinet' component={Cabinet}/>
                <Route path='/projects' component={CProjects}/>
                <Route path='/project' component={ConnectedProject}/>
                <Route path='/search' component={ConnectFormSearch}/>
            </Switch>}
            {!token && <Switch>
                <Route path='/login' component={ConnectLoginForm}/>
                <Route path='/reg' component={ConnectFormReg}/>
                <Route path='/' component={Main}/>
            </Switch>}
          </Router>
        </div>
    )
}

const ConnectedRouts = connect(state =>({token: state.a.token}), null)(Routs);

export default ConnectedRouts;