import "./App.css";
import "bootstrap/dist/css/bootstrap.min.css";
import { store, socket } from "./reducers";
import createHistory from "history/createBrowserHistory";
import { Provider, connect } from "react-redux";
import { Router, Route, Switch } from "react-router-dom";
import { CLogin } from "./pages/LoginPage";
import { CRegistration } from "./pages/RegPage";
import Header from "./pages/Header";
import { CProfilePage } from "./pages/ProfilePage";
import { ChatPage, CChatsPage } from "./pages/ChatsPage";
import { CNewChatPage } from "./pages/NewChatPage";
import { CChangePass } from "./pages/ChangePassPage";
import { ChangesDone } from "./pages/ChangesDonePage";
import { ChangesDoneForChats } from './pages/ChangeDoneForChat'
import { AboutUs } from "./pages/AboutUs";
import { Redirect } from "react-router-dom";
import { OneChat } from './pages/MsgPage'

export const history = createHistory();

function App() {
    return (
        <div className="container">
            <Router history={history}>
                <Provider store={store}>
                    <Switch>
                        <Route path="/login" component={() => <></>} />
                        <Route path="/registration" component={() => <></>} />
                        <Header />
                    </Switch>
                    <Route path="/login" component={CLogin} />
                    <Route path="/registration" component={CRegistration} />
                    <Route path="/profile" component={CProfilePage} />
                    
                    <Route path="/newchat" component={CNewChatPage} />
                    <Route path="/changepas" component={CChangePass} />
                    <Route path="/changesdone" component={ChangesDone} />
                    <Route path="/changesdonechats" component={ChangesDoneForChats} />
                    <Route path="/aboutus" component={AboutUs} />
                    <div className="chatPageContainer">
                    <Route path="/main/" component={CChatsPage} />
                    {/* <Route path="/main/:_id" component={OneChat} /> */}
                    </div>
                    
                    <Redirect
                        to={
                            store.getState().auth.token === undefined
                                ? "/login"
                                : "/main"
                        }
                    />
                </Provider>
            </Router>
        </div>
    );
}



export default App;
