import { BrowserRouter, Route, Switch } from "react-router-dom";
import AppBar from "./AppBar.jsx";
import TodoList from "../views/todo/TodoList.jsx";
import TodoEdit from "../views/todo/TodoEdit.jsx";
import EntryList from "../views/entry/EntryList.jsx";
import EntryEdit from "../views/entry/EntryEdit.jsx";
import Login from "../views/auth/Login.jsx";
import PrivateRoute from "./PrivateRoute.jsx";
import { connect } from "react-redux";

const AppRouter = () =>(
	<BrowserRouter>
		<div id="Window">
		<AppBar />
			<main>
				<Switch>
					<Route key="login" exact path ="/login" component={Login}/>
					<PrivateRoute key="todoList" exact path="/" component={TodoList} />
					<PrivateRoute key="todoList" exact path="/todoList" component={TodoList} />
					<PrivateRoute key="todoEdit" exact path="/todoList/:id" component={TodoEdit} />
					<PrivateRoute key="todoEdit" exact path="/todoList/new" component={TodoEdit} />
					<PrivateRoute key="entryList" exact path="/todolist/:id/entries" component={EntryList} />
					<PrivateRoute key="entryEdit" exact path="/todoList/:listId/entries/:id" component={EntryEdit} />
					<PrivateRoute key="entryEdit" exact path="/todoList/:listId/entries/new" component={EntryEdit} />
				</Switch>
			</main>
		</div>
	</BrowserRouter>
);
export default connect(
	(state, ownProps) => {
		return Object.assign({}, ownProps);
	}
)(AppRouter);