Replaced login screen with loader, wile validating access token

frontend/src/App.js

@@ -1,34 +1,37 @@
-import React, {Component} from 'react';
+import React, { Component } from 'react';
-import {connect} from 'react-redux';
+import { connect } from 'react-redux';
 import ContentContainer from './containers/ContentContainer.jsx';
 import LogInContainer from './containers/login/LogInContainer.jsx';
 import './App.css';
 import './mainComponents/box/WiaasBox.css';
 import NotificationBox from './mainComponents/notification/NotificationBox.jsx';
 import DialogBox from './mainComponents/dialog/DialogBox.jsx';
+import LoaderContainer from './containers/LoaderContainer';
 
 class App extends Component {
+
   render() {
-    const {isLoggedIn, updateMessages, isDialogOpen, dialogContent} = this.props;
+    const { isLoggedIn, updateMessages, isDialogOpen, dialogContent } = this.props;
+    let hasAccesToken = localStorage.accessToken;
 
     return (<div className="App">
 
       {
         !isLoggedIn
-          ? (<LogInContainer/>)
+          ? hasAccesToken ? (<LoaderContainer />) : (<LogInContainer />)
-          : (<ContentContainer className="content"/>)
+          : (<ContentContainer className="content" />)
       }
-      <NotificationBox messages={updateMessages}/>
+      <NotificationBox messages={updateMessages} />
-      <DialogBox isDialogOpen={isDialogOpen} dialogContent={dialogContent}/>
+      <DialogBox isDialogOpen={isDialogOpen} dialogContent={dialogContent} />
     </div>);
   }
 }
 
 const mapStateToProps = (state) => ({
-    isLoggedIn: state.auth.isLoggedIn,
+  isLoggedIn: state.auth.isLoggedIn,
-    updateMessages: state.notificationReducer.updateMessages,
+  updateMessages: state.notificationReducer.updateMessages,
-    isDialogOpen: state.dialogReducer.isDialogOpen,
+  isDialogOpen: state.dialogReducer.isDialogOpen,
-    dialogContent: state.dialogReducer.dialogContent
+  dialogContent: state.dialogReducer.dialogContent
 });
 
 export default connect(mapStateToProps)(App);

frontend/src/containers/LoaderContainer.jsx

@@ -0,0 +1,27 @@
+import React, { Component } from 'react';
+import { connect } from 'react-redux';
+import './loaderContainer.css';
+import { validateAccessToken } from '../actions/login/authActions';
+import {
+    Col
+} from 'reactstrap';
+
+class LoaderContainer extends Component {
+
+    componentDidMount() {
+        if (localStorage.accessToken) {
+            this.props.dispatch(validateAccessToken());
+        }
+    }
+
+    render() {
+        return (
+            <Col xl="12" className="loader">
+                <i className="fa fa-spinner fa-spin fa-8x login-loader" aria-hidden="true"></i>
+            </Col>
+        )
+    }
+
+}
+
+export default connect()(LoaderContainer);

frontend/src/containers/loaderContainer.scss

@@ -0,0 +1,7 @@
+.fa-8x {
+    font-size: 8em;
+}
+
+.login-loader {
+    padding: 100px
+}

frontend/src/containers/login/LogInForm.jsx

@@ -9,7 +9,7 @@ import {
     Button
 } from 'reactstrap';
 import './login.css';
-import {validateCredentials, validateAccessToken, generatePassword} from '../../actions/login/authActions';
+import {validateCredentials, generatePassword} from '../../actions/login/authActions';
 import {setDialogContent, setDialogOpenFlag} from '../../actions/dialog/dialogActions';
 import {loginMessages, loginTexts} from '../../constants/authConstants';
 
@@ -53,12 +53,6 @@ class LogInForm extends Component {
         this.props.dispatch(generatePassword(currentDialogState.inputValue));
     }
 
-    componentDidMount() {
-        if (localStorage.accessToken) {
-            this.props.dispatch(validateAccessToken());
-        }
-    }
-
     setDialogParams(dialogContent) {
         this.props.dispatch(setDialogOpenFlag(true));
         this.props.dispatch(setDialogContent(dialogContent));