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

@@ -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}) => {

web/ASC.Web.Client/src/actions/actionTypes.js

@@ -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';

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,

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('');

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);
 

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 {

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;
+export default authReducer;

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;

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 } });
         });
 };

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();

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 */