|
@@ -0,0 +1,103 @@
|
|
|
+import React, { useEffect } from 'react';
|
|
|
+import './App.css';
|
|
|
+import { Router, Switch, Route } from 'react-router-dom';
|
|
|
+import { Provider, connect } from "react-redux";
|
|
|
+import { socket } from './store';
|
|
|
+
|
|
|
+import { LoginPage } from './pages/LoginPage';
|
|
|
+import { RegisterPage } from './pages/RegisterPage';
|
|
|
+import { ChatPage } from './pages/ChatPage';
|
|
|
+import { OpenChatPage } from './pages/OpenChatPage';
|
|
|
+import { ChatInfoPage } from './pages/ChatInfoPage'
|
|
|
+import { CreateChatPage } from './pages/CreateChatPage';
|
|
|
+import { Header } from './components/Header';
|
|
|
+import { PublicHeader } from './components/PublicHeader'
|
|
|
+import { PrivateHeader } from './components/PrivateHeader';
|
|
|
+import { PageAboutMe } from './pages/AbouteMePage'
|
|
|
+import { HomePage } from './pages/HomePage';
|
|
|
+
|
|
|
+import { actionFullLogin, actionAuthLogin } from './store/actions/action-login-promise'
|
|
|
+import { actionAuthLogout } from './store/actions/action-logout'
|
|
|
+import { actionRegister } from './store/actions/action-register-promise'
|
|
|
+import { actionCreateChat } from './store/actions/action-create-chat';
|
|
|
+import { actionCreateMessage } from './store/actions/action-create-msg';
|
|
|
+import { actionAboutMe } from './store/actions/action-aboutMe';
|
|
|
+import { actionSearchUser } from './store/actions/action-search-user';
|
|
|
+
|
|
|
+import store from './store'
|
|
|
+import { history } from './history'
|
|
|
+
|
|
|
+const HeaderSwitch = () => {
|
|
|
+
|
|
|
+ return (
|
|
|
+ <Switch>
|
|
|
+ <Route path="/login" component={PublicHeader} exact />
|
|
|
+ <Route path="/registration" component={PublicHeader} exact />
|
|
|
+ <Route path="/chat" component={PrivateHeader} exact />
|
|
|
+ <Route path="/chat/:id" component={PrivateHeader} exact />
|
|
|
+ <Route path="/chat/:id/info" component={PrivateHeader} exact />
|
|
|
+ <Route path="/create-chat" component={PrivateHeader} exact />
|
|
|
+ <Route path="/about-me" component={PrivateHeader} exact />
|
|
|
+ <Route path="/" component={PublicHeader} exact />
|
|
|
+ </Switch>
|
|
|
+ )
|
|
|
+}
|
|
|
+
|
|
|
+const MainSwitch = ({ token }) => {
|
|
|
+ if (token) {
|
|
|
+ console.log("сокет")
|
|
|
+ socket.emit("jwt", token)
|
|
|
+ }
|
|
|
+ return (
|
|
|
+ <>
|
|
|
+ <Switch>
|
|
|
+ <div className="App">
|
|
|
+ <Route path="/login" component={CLoginForm} exact />
|
|
|
+ <Route path="/registration" component={CRegisterForm} exact />
|
|
|
+ <Route path="/chat" component={CPageChat} exact />
|
|
|
+ <Route path="/chat/:id" component={COpenPageChat} exact />
|
|
|
+ <Route path="/chat/:id/info" component={CPageChatInfo} exact />
|
|
|
+ <Route path="/create-chat" component={CCreateChat} exact />
|
|
|
+ <Route path="/about-me" component={CPageAboutMe} exact />
|
|
|
+ <Route path="/" component={HomePage} exact />
|
|
|
+ </div>
|
|
|
+ </Switch>
|
|
|
+ </>
|
|
|
+ )
|
|
|
+}
|
|
|
+
|
|
|
+
|
|
|
+const CLoginForm = connect(null, { onLogin: actionFullLogin, outLogin: actionAuthLogout })(LoginPage);
|
|
|
+const CRegisterForm = connect(null, { onRegister: actionRegister })(RegisterPage)
|
|
|
+const CPageAboutMe = connect(state => ({ userName: state.promise.userData?.payload.login, avatar: state.promise.userData?.payload.avatar, chats: state.promise.userData?.payload.chats }), { getData: actionAboutMe })(PageAboutMe)
|
|
|
+const CPageChat = connect(state => ({ chats: state.chat.userData?.payload.chats }), { getData: actionAboutMe })(ChatPage)
|
|
|
+const COpenPageChat = connect(state => ({ chats: state.chat.userData?.payload.chats, onCreateMsg: actionCreateMessage }), { getData: actionAboutMe })(OpenChatPage)
|
|
|
+const CPageChatInfo = connect(state => ({ chats: state.chat.userData?.payload.chats, us: state.promise.searchUs?.payload?._id, onSearchUser: actionSearchUser }), { getData: actionAboutMe })(ChatInfoPage)
|
|
|
+const CCreateChat = connect(null, { onCreate: actionCreateChat })(CreateChatPage)
|
|
|
+const CMainSwitch = connect((state) => ({ token: state.auth.token || null }))(
|
|
|
+ MainSwitch
|
|
|
+);
|
|
|
+
|
|
|
+
|
|
|
+function App() {
|
|
|
+
|
|
|
+ useEffect(() => {
|
|
|
+ if (localStorage.authToken) {
|
|
|
+ store.dispatch(actionAuthLogin(localStorage.authToken));
|
|
|
+
|
|
|
+ }
|
|
|
+ }, [])
|
|
|
+
|
|
|
+ return (
|
|
|
+ <Provider store={store}>
|
|
|
+ <Router history={history}>
|
|
|
+
|
|
|
+ <HeaderSwitch />
|
|
|
+ <CMainSwitch />
|
|
|
+
|
|
|
+ </Router>
|
|
|
+ </Provider>
|
|
|
+ );
|
|
|
+}
|
|
|
+
|
|
|
+export default App;
|