From 4d18d6a894178fb2d49642e9f4d721fa615cda20 Mon Sep 17 00:00:00 2001 From: Alexey Safronov Date: Thu, 15 Aug 2019 10:48:16 +0300 Subject: [PATCH] web: Client: Refactoring: Moved actions and reducers to store folder; Moved utils to store/services folder; Made Home component lazy; --- web/ASC.Web.Client/src/App.js | 4 +-- web/ASC.Web.Client/src/actions/actionTypes.js | 5 --- .../src/components/{Layout => }/Layout.js | 36 ++++++------------- .../src/components/pages/Login/Login.js | 2 +- web/ASC.Web.Client/src/index.js | 5 ++- .../authActions.js => store/auth/actions.js} | 11 ++++-- .../auth.js => store/auth/reducer.js} | 6 ++-- .../src/{reducers => store}/rootReducer.js | 4 +-- .../src/{utils => store/services}/api.js | 4 +-- .../src/{utils => store/services}/fakeApi.js | 0 .../services}/setAuthorizationToken.js | 2 +- web/ASC.Web.Client/src/store/store.js | 2 +- 12 files changed, 33 insertions(+), 48 deletions(-) delete mode 100644 web/ASC.Web.Client/src/actions/actionTypes.js rename web/ASC.Web.Client/src/components/{Layout => }/Layout.js (65%) rename web/ASC.Web.Client/src/{actions/authActions.js => store/auth/actions.js} (77%) rename web/ASC.Web.Client/src/{reducers/auth.js => store/auth/reducer.js} (88%) rename web/ASC.Web.Client/src/{reducers => store}/rootReducer.js (63%) rename web/ASC.Web.Client/src/{utils => store/services}/api.js (99%) rename web/ASC.Web.Client/src/{utils => store/services}/fakeApi.js (100%) rename web/ASC.Web.Client/src/{utils => store/services}/setAuthorizationToken.js (92%) diff --git a/web/ASC.Web.Client/src/App.js b/web/ASC.Web.Client/src/App.js index a0f0708d80..5c37e45094 100644 --- a/web/ASC.Web.Client/src/App.js +++ b/web/ASC.Web.Client/src/App.js @@ -1,12 +1,12 @@ import React, { Suspense, lazy } from "react"; import { BrowserRouter, Route, Switch } from "react-router-dom"; import { Loader, ErrorContainer } from "asc-web-components"; -import StudioLayout from "./components/Layout/Layout"; +import StudioLayout from "./components/Layout"; import Login from "./components/pages/Login/Login"; -import Home from "./components/pages/Home/Home"; import { withTranslation } from 'react-i18next'; import { PrivateRoute } from "./helpers/privateRoute"; +const Home = lazy(() => import("./components/pages/Home/Home")); const About = lazy(() => import("./components/pages/About/About")); const App = ({t}) => { diff --git a/web/ASC.Web.Client/src/actions/actionTypes.js b/web/ASC.Web.Client/src/actions/actionTypes.js deleted file mode 100644 index 94810063e3..0000000000 --- a/web/ASC.Web.Client/src/actions/actionTypes.js +++ /dev/null @@ -1,5 +0,0 @@ -export const LOGIN_POST = 'LOGIN_POST'; -export const SET_CURRENT_USER = 'SET_CURRENT_USER'; -export const SET_MODULES = 'SET_MODULES'; -export const SET_IS_LOADED = 'SET_IS_LOADED'; -export const LOGOUT = 'LOGOUT'; \ No newline at end of file diff --git a/web/ASC.Web.Client/src/components/Layout/Layout.js b/web/ASC.Web.Client/src/components/Layout.js similarity index 65% rename from web/ASC.Web.Client/src/components/Layout/Layout.js rename to web/ASC.Web.Client/src/components/Layout.js index cc4f219186..8be2c8d05a 100644 --- a/web/ASC.Web.Client/src/components/Layout/Layout.js +++ b/web/ASC.Web.Client/src/components/Layout.js @@ -3,7 +3,7 @@ import { connect } from 'react-redux'; import PropTypes from 'prop-types'; import { withRouter } from "react-router"; import { Layout } from 'asc-web-components'; -import { logout } from '../../actions/authActions'; +import { logout } from '../store/auth/actions'; import { withTranslation } from 'react-i18next'; const StudioLayout = props => { @@ -28,10 +28,7 @@ const StudioLayout = props => { }, ]; - console.log(props); - const layoutProps = { currentUserActions: currentUserActions, ...props }; - console.log(auth.isAuthenticated, auth.isLoaded); return ( auth.isAuthenticated && auth.isLoaded @@ -45,36 +42,25 @@ StudioLayout.propTypes = { logout: PropTypes.func.isRequired }; -function convertModules(modules) { +const getAvailableModules = (modules) => { const separator = { seporator: true, id: 'nav-seporator-1' }; - const chat = { - id: '22222222-2222-2222-2222-222222222222', - title: 'Chat', - iconName: 'ChatIcon', - notifications: 3, - url: '/products/chat/', - onClick: () => window.open('/products/chat/', '_blank'), - onBadgeClick: e => console.log('ChatIconBadge Clicked', e), - isolateMode: true - }; - - let items = modules.map(item => { + const products = modules.map(product => { return { - id: '11111111-1111-1111-1111-111111111111', - title: item.title, + id: product.id, + title: product.title, iconName: 'PeopleIcon', notifications: 0, - url: item.link, - onClick: () => window.open(item.link, '_self'), - onBadgeClick: e => console.log('DocumentsIconBadge Clicked', e) + url: product.link, + onClick: () => window.open(product.link, '_self'), + onBadgeClick: e => console.log('PeopleIconBadge Clicked', e) }; }) || []; - return items.length ? [separator, ...items, chat] : items; -} + return products.length ? [separator, ...products] : products; +}; function mapStateToProps(state) { - let availableModules = convertModules(state.auth.modules); + let availableModules = getAvailableModules(state.auth.modules); return { auth: state.auth, availableModules: availableModules, diff --git a/web/ASC.Web.Client/src/components/pages/Login/Login.js b/web/ASC.Web.Client/src/components/pages/Login/Login.js index 357dcfe446..7fc427f3e4 100644 --- a/web/ASC.Web.Client/src/components/pages/Login/Login.js +++ b/web/ASC.Web.Client/src/components/pages/Login/Login.js @@ -4,7 +4,7 @@ import { withRouter } from "react-router"; import { Collapse, Container, Row, Col, Card, CardTitle, CardImg } from 'reactstrap'; import { Button, TextInput, PageLayout } from 'asc-web-components'; import { connect } from 'react-redux'; -import { login } from '../../../actions/authActions'; +import { login } from '../../../store/auth/actions'; const Form = props => { const [identifier, setIdentifier] = useState(''); diff --git a/web/ASC.Web.Client/src/index.js b/web/ASC.Web.Client/src/index.js index 575f23cfae..9a3eda54ec 100644 --- a/web/ASC.Web.Client/src/index.js +++ b/web/ASC.Web.Client/src/index.js @@ -2,15 +2,14 @@ import React from 'react'; import ReactDOM from 'react-dom'; import { Provider } from 'react-redux'; import Cookies from 'universal-cookie'; -import setAuthorizationToken from './utils/setAuthorizationToken'; +import setAuthorizationToken from './store/services/setAuthorizationToken'; import { AUTH_KEY } from './helpers/constants'; import store from './store/store'; import './custom.scss'; import App from './App'; import './i18n' - import * as serviceWorker from './serviceWorker'; -import { getUserInfo } from './actions/authActions'; +import { getUserInfo } from './store/auth/actions'; var token = (new Cookies()).get(AUTH_KEY); diff --git a/web/ASC.Web.Client/src/actions/authActions.js b/web/ASC.Web.Client/src/store/auth/actions.js similarity index 77% rename from web/ASC.Web.Client/src/actions/authActions.js rename to web/ASC.Web.Client/src/store/auth/actions.js index 6da870efe6..119eb2457d 100644 --- a/web/ASC.Web.Client/src/actions/authActions.js +++ b/web/ASC.Web.Client/src/store/auth/actions.js @@ -1,6 +1,11 @@ -import * as api from '../utils/api'; -import { SET_CURRENT_USER, SET_MODULES, SET_IS_LOADED, LOGOUT } from './actionTypes'; -import setAuthorizationToken from '../utils/setAuthorizationToken'; +import * as api from '../services/api'; +import setAuthorizationToken from '../services/setAuthorizationToken'; + +export const LOGIN_POST = 'LOGIN_POST'; +export const SET_CURRENT_USER = 'SET_CURRENT_USER'; +export const SET_MODULES = 'SET_MODULES'; +export const SET_IS_LOADED = 'SET_IS_LOADED'; +export const LOGOUT = 'LOGOUT'; export function setCurrentUser(user) { return { diff --git a/web/ASC.Web.Client/src/reducers/auth.js b/web/ASC.Web.Client/src/store/auth/reducer.js similarity index 88% rename from web/ASC.Web.Client/src/reducers/auth.js rename to web/ASC.Web.Client/src/store/auth/reducer.js index 2de01af1dc..9a4beb63fb 100644 --- a/web/ASC.Web.Client/src/reducers/auth.js +++ b/web/ASC.Web.Client/src/store/auth/reducer.js @@ -1,4 +1,4 @@ -import { SET_CURRENT_USER, SET_MODULES, SET_IS_LOADED, LOGOUT } from '../actions/actionTypes'; +import { SET_CURRENT_USER, SET_MODULES, SET_IS_LOADED, LOGOUT } from './actions'; import isEmpty from 'lodash/isEmpty'; const initialState = { @@ -8,7 +8,7 @@ const initialState = { modules: [] } -const auth = (state = initialState, action) => { +const authReducer = (state = initialState, action) => { switch (action.type) { case SET_CURRENT_USER: return Object.assign({}, state, { @@ -30,4 +30,4 @@ const auth = (state = initialState, action) => { } } -export default auth; \ No newline at end of file +export default authReducer; \ No newline at end of file diff --git a/web/ASC.Web.Client/src/reducers/rootReducer.js b/web/ASC.Web.Client/src/store/rootReducer.js similarity index 63% rename from web/ASC.Web.Client/src/reducers/rootReducer.js rename to web/ASC.Web.Client/src/store/rootReducer.js index 8c31f0d6c3..449b2471e1 100644 --- a/web/ASC.Web.Client/src/reducers/rootReducer.js +++ b/web/ASC.Web.Client/src/store/rootReducer.js @@ -1,8 +1,8 @@ import { combineReducers } from 'redux'; -import auth from './auth'; +import authReducer from './auth/reducer'; const rootReducer = combineReducers({ - auth + auth: authReducer }); export default rootReducer; \ No newline at end of file diff --git a/web/ASC.Web.Client/src/utils/api.js b/web/ASC.Web.Client/src/store/services/api.js similarity index 99% rename from web/ASC.Web.Client/src/utils/api.js rename to web/ASC.Web.Client/src/store/services/api.js index 2319c1f2ec..385cc311d5 100644 --- a/web/ASC.Web.Client/src/utils/api.js +++ b/web/ASC.Web.Client/src/store/services/api.js @@ -19,8 +19,8 @@ export function getModulesList() { const modules = res.data.response; return axios.all(modules.map((m) => axios.get(`${window.location.origin}/${m}`))) }) - .then((res) => { - const response = res.map((d) => d.data.response); + .then((res) => { + const response = res.map((d) => d.data.response); return Promise.resolve({ data: { response } }); }); }; diff --git a/web/ASC.Web.Client/src/utils/fakeApi.js b/web/ASC.Web.Client/src/store/services/fakeApi.js similarity index 100% rename from web/ASC.Web.Client/src/utils/fakeApi.js rename to web/ASC.Web.Client/src/store/services/fakeApi.js diff --git a/web/ASC.Web.Client/src/utils/setAuthorizationToken.js b/web/ASC.Web.Client/src/store/services/setAuthorizationToken.js similarity index 92% rename from web/ASC.Web.Client/src/utils/setAuthorizationToken.js rename to web/ASC.Web.Client/src/store/services/setAuthorizationToken.js index 9340435903..85db3d309b 100644 --- a/web/ASC.Web.Client/src/utils/setAuthorizationToken.js +++ b/web/ASC.Web.Client/src/store/services/setAuthorizationToken.js @@ -1,6 +1,6 @@ import axios from 'axios'; import Cookies from 'universal-cookie'; -import { AUTH_KEY } from '../helpers/constants'; +import { AUTH_KEY } from '../../helpers/constants'; export default function setAuthorizationToken(token) { const cookies = new Cookies(); diff --git a/web/ASC.Web.Client/src/store/store.js b/web/ASC.Web.Client/src/store/store.js index 67351f1958..3b9d27bd88 100644 --- a/web/ASC.Web.Client/src/store/store.js +++ b/web/ASC.Web.Client/src/store/store.js @@ -1,6 +1,6 @@ import { createStore, applyMiddleware } from 'redux'; import { composeWithDevTools } from 'redux-devtools-extension/logOnlyInProduction'; -import rootReducer from '../reducers/rootReducer'; +import rootReducer from './rootReducer'; import thunk from 'redux-thunk'; /* eslint-disable no-underscore-dangle */