From 0882db553c80afbca4a8805a372a8b1095cba12c Mon Sep 17 00:00:00 2001
From: Lavhe <mulavhe@gmail.com>
Date: Thu, 11 Jan 2018 10:43:45 +0200
Subject: [PATCH 1/8] Added axios to make api calls

---
 package-lock.json | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index 6440eba..6a4f4fa 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -2666,7 +2666,7 @@
     "es6-error": {
       "version": "4.1.1",
       "resolved": "https://registry.npmjs.org/es6-error/-/es6-error-4.1.1.tgz",
-      "integrity": "sha512-Um/+FxMr9CISWh0bi5Zv0iOD+4cFh5qLeks1qhAopKVAJw3drgKbKySikp7wGhDL0HPeaja0P5ULZrxLkniUVg=="
+      "integrity": "sha1-njr0B0Wd7tR+mpH5uIWoTrBcVh0="
     },
     "es6-iterator": {
       "version": "2.0.3",
@@ -8293,7 +8293,7 @@
     "react-material-ui-form-validator": {
       "version": "2.0.0-beta.3",
       "resolved": "https://registry.npmjs.org/react-material-ui-form-validator/-/react-material-ui-form-validator-2.0.0-beta.3.tgz",
-      "integrity": "sha512-qEvzfH63b5mGIJN4KDww2jbqEu3KM1yInL9ZL54nmpn68S0ClpbjtZp4YNwHos24AajV4ABolDebL1HmbGbkPA=="
+      "integrity": "sha1-S+x23BQoW08dg1tjuAQnUrWJV0c="
     },
     "react-redux": {
       "version": "5.0.6",
@@ -8595,7 +8595,7 @@
     "redux-form": {
       "version": "7.2.0",
       "resolved": "https://registry.npmjs.org/redux-form/-/redux-form-7.2.0.tgz",
-      "integrity": "sha512-qbgeI19drwnm9FeGAotDA1vsZO8q94XF7IxPDuJmSXxDYX2rqzhND6NROahCBJfBK5xM1cchvmgscO2rry1EEw==",
+      "integrity": "sha1-RGXZvIY+QLFwRpXWcr6nX8+B2wQ=",
       "requires": {
         "deep-equal": "1.0.1",
         "es6-error": "4.1.1",

From 187be9cbac1fb9df1155806d58bb700a2c9d7529 Mon Sep 17 00:00:00 2001
From: Lavhe <mulavhe@gmail.com>
Date: Thu, 11 Jan 2018 13:24:05 +0200
Subject: [PATCH 2/8] Added popover to start a new chat

---
 src/components/accountScreen/accountScreen.js |  7 ++-
 src/components/headerNav/headerNav.js         | 47 ++++++++++++++++++-
 src/reducers/Account.js                       | 14 ++++++
 3 files changed, 64 insertions(+), 4 deletions(-)

diff --git a/src/components/accountScreen/accountScreen.js b/src/components/accountScreen/accountScreen.js
index ee4f85d..4476a75 100644
--- a/src/components/accountScreen/accountScreen.js
+++ b/src/components/accountScreen/accountScreen.js
@@ -7,6 +7,8 @@ import HeaderNav from '../headerNav/headerNav';
 import { bindActionCreators } from 'redux';
 import { connect } from 'react-redux';
 
+import FlatButton from 'material-ui/FlatButton/FlatButton';
+
 import {
     getUser,
     changeUser,
@@ -65,8 +67,6 @@ const cardTextStyle = {
 
 const searchBarStyle = {
     borderRadius: '21.5px',
-    height: '43px',
-    width: '345px',
     height: '6vh',
     width: '19vw',
     border: '1px solid #979797',
@@ -249,6 +249,9 @@ class AccountScreen extends Component {
                             onChange={text => this.filterList(text)}
                         />
                     </div>
+                    <div className="searchContainer">
+                      <FlatButton>Start a new chat</FlatButton>
+                    </div>
 
                     <ul className="defaultList">
                         {this.props.filteredChats.map(chat => (
diff --git a/src/components/headerNav/headerNav.js b/src/components/headerNav/headerNav.js
index 4241d8d..3afdaf0 100644
--- a/src/components/headerNav/headerNav.js
+++ b/src/components/headerNav/headerNav.js
@@ -7,6 +7,14 @@ import { Route } from 'react-router-dom';
 import IconButton from 'material-ui/IconButton';
 import IconMenu from 'material-ui/IconMenu';
 import MenuItem from 'material-ui/MenuItem';
+import Popover from 'material-ui/Popover';
+import Menu from 'material-ui/Menu';
+
+import FlatButton from 'material-ui/FlatButton/FlatButton';
+
+import TextField from 'material-ui/TextField';
+
+import {Card, CardActions, CardHeader, CardMedia, CardTitle, CardText} from 'material-ui/Card';
 
 import { getUser, changeUser, getCurrentUser, registerUser, loginUser ,logOut} from '../../reducers/Account';
 
@@ -18,7 +26,11 @@ class HeaderNav extends Component {
     constructor(props){
       super(props);
       this.props = props;
-  }
+    }
+
+    state = {
+      open:false
+    }
 
     handleChange = (event, logged) => {
         this.setState({ logged: logged });
@@ -38,11 +50,42 @@ class HeaderNav extends Component {
                 <div className="navBar">
                     <div>
                       <Route render={({ history }) => (
-                        <div className="newChat" primary={true} onClick={() => { history.push('/accountScreen')}}>
+                        <div className="newChat" primary={true} onMouseEnter={(e) =>{
+                            this.setState({ open: true })
+                          }} onClick={() => { history.push('/accountScreen')}}>
                             <label className="newChatLbl"> NEW CHAT </label>
                         </div>
                       )} />
 
+                              <Popover
+                                open={this.state.open}
+                                anchorOrigin={{horizontal: 'right', vertical: 'bottom'}}
+                                targetOrigin={{horizontal: 'right', vertical: 'bottom'}}
+                                onRequestClose={this.handleRequestClose}>
+                                  <Card>
+                                      <CardTitle title="Search for a user"/>
+                                      <CardText>
+                                        <div>
+                                          <FlatButton label="X" onClick={(e)=>{ this.setState({ open: false })}}>
+
+                                          </FlatButton>
+                                        </div>
+                                        <TextField
+                                            hintText="Friend's Email"
+                                            onKeyDown={e => {
+                                                if (e.key === 'Enter' && e.target.value.length > 0) {
+                                                    e.target.value = '';
+                                                }
+                                            }}
+                                            style={{
+                                                padding: '1px 0px 1px 25px',
+                                                width: '100%'
+                                            }}
+                                        />
+                                      </CardText>
+                                    </Card>
+                              </Popover>
+
                         <div className="newGroup" primary={true} onClick={() => {}}>
                             <label className="newGroupLbl"> NEW GROUP </label>
                         </div>
diff --git a/src/reducers/Account.js b/src/reducers/Account.js
index cf7401a..82e8094 100644
--- a/src/reducers/Account.js
+++ b/src/reducers/Account.js
@@ -1,3 +1,6 @@
+import axios from 'axios'
+
+
 export const USER_ACCOUNT = 'Account/USER_ACCOUNT';
 export const REGISTER_USER_ACCOUNT = 'Account/REGISTER_USER_ACCOUNT';
 export const LOGIN_USER_ACCOUNT = 'Account/LOGIN_USER_ACCOUNT';
@@ -10,6 +13,10 @@ export const CHANGE_SELECTED_CHAT = 'Account/CHANGE_SELECTED_CHAT';
 export const CHANGE_RECIEVER = 'Account/CHANGE_RECIEVER';
 
 const initialState = {
+    api:{
+      host:'http://192.168.0.20',
+      port:54980
+    },
     currentUserChats: [],
     filteredChats: [],
     currentUser:null,
@@ -106,6 +113,13 @@ export default (state = initialState, action) => {
             };
 
         case CURRENT_USER_ACCOUNT:
+            axios.get( state.api.host + ':'  + state.api.port + '/api/chats').then(function (response) {
+                console.log(response.data);
+            }).catch(function (error) {
+                alert(error);
+                console.log(error);
+            });
+
             return {
                 ...state
             };

From 14448a8117e4925d872d2c9a38faec76625740cd Mon Sep 17 00:00:00 2001
From: Lavhe <mulavhe@gmail.com>
Date: Thu, 11 Jan 2018 14:15:12 +0200
Subject: [PATCH 3/8] Start new chat functionality (Almost done)

---
 src/components/accountScreen/accountScreen.js |  4 --
 src/components/headerNav/headerNav.js         | 48 ++++++++++++++++++-
 2 files changed, 46 insertions(+), 6 deletions(-)

diff --git a/src/components/accountScreen/accountScreen.js b/src/components/accountScreen/accountScreen.js
index 4476a75..3ad286a 100644
--- a/src/components/accountScreen/accountScreen.js
+++ b/src/components/accountScreen/accountScreen.js
@@ -249,10 +249,6 @@ class AccountScreen extends Component {
                             onChange={text => this.filterList(text)}
                         />
                     </div>
-                    <div className="searchContainer">
-                      <FlatButton>Start a new chat</FlatButton>
-                    </div>
-
                     <ul className="defaultList">
                         {this.props.filteredChats.map(chat => (
                             <li
diff --git a/src/components/headerNav/headerNav.js b/src/components/headerNav/headerNav.js
index 3afdaf0..6abd7a7 100644
--- a/src/components/headerNav/headerNav.js
+++ b/src/components/headerNav/headerNav.js
@@ -10,6 +10,10 @@ import MenuItem from 'material-ui/MenuItem';
 import Popover from 'material-ui/Popover';
 import Menu from 'material-ui/Menu';
 
+import Avatar from 'material-ui/Avatar';
+import {List, ListItem} from 'material-ui/List';
+import Subheader from 'material-ui/Subheader';
+
 import FlatButton from 'material-ui/FlatButton/FlatButton';
 
 import TextField from 'material-ui/TextField';
@@ -29,7 +33,8 @@ class HeaderNav extends Component {
     }
 
     state = {
-      open:false
+      open:false,
+      txtSearch:''
     }
 
     handleChange = (event, logged) => {
@@ -76,6 +81,8 @@ class HeaderNav extends Component {
                                                 if (e.key === 'Enter' && e.target.value.length > 0) {
                                                     e.target.value = '';
                                                 }
+                                                this.setState({txtSearch : e.target.value});
+
                                             }}
                                             style={{
                                                 padding: '1px 0px 1px 25px',
@@ -84,6 +91,42 @@ class HeaderNav extends Component {
                                         />
                                       </CardText>
                                     </Card>
+                                    <List>
+                                      <Subheader>Users that contains : { this.state.txtSearch } </Subheader>
+                                      <Route render={({ history }) => (
+                                           this.props.users.map(user =>(
+                                              (user.userEmail.indexOf(this.state.txtSearch) !== -1) ||
+                                              (user.userSurname.indexOf(this.state.txtSearch) !== -1) ||
+                                              (user.userName.indexOf(this.state.txtSearch) !== -1) ?
+
+                                                      <ListItem
+                                                        leftAvatar={
+                                                          <Avatar src={ user.userImg } />
+                                                        }
+                                                        primaryText={ user.userSurname + " " + user.userName}
+                                                        secondaryText={ user.userEmail }
+                                                        onClick={(e)=>{
+                                                          let found = false;
+                                                          for(let i=0;i<this.props.msgs.length;i++){
+                                                            if(this.props.msgs[i].senderID === this.props.currentUser.userID && this.props.msgs[i].receiverID === user.userID ||
+                                                               this.props.msgs[i].receiverID === this.props.currentUser.userID && this.props.msgs[i].senderID === user.userID){
+                                                              found = true;
+                                                            }
+                                                          }
+                                                          if(!found){
+                                                            this.props.addMsg("Hi",this.props.currentUser.userID,user.userID);
+                                                          }
+                                                          history.push('/accountScreen');
+                                                          this.setState({open:false});
+                                                        }}
+                                                      />
+                                          :
+
+                                          <p></p>
+
+                                          ))
+                                      )} />
+                                     </List>
                               </Popover>
 
                         <div className="newGroup" primary={true} onClick={() => {}}>
@@ -163,7 +206,8 @@ class HeaderNav extends Component {
 
 const mapStateToProps = state =>
 {
-  return {chats: state.Chat.chats,
+  return {
+    chats: state.Chat.chats,
     msgs: state.Chat.msgs,
     currentUser: state.Account.currentUser,
     users: state.Account.users,

From 4385cc92f8a264ead956911e9f997c9f72799c5c Mon Sep 17 00:00:00 2001
From: Lavhe <mulavhe@gmail.com>
Date: Fri, 12 Jan 2018 09:26:49 +0200
Subject: [PATCH 4/8] Fixed the post bug with axios and Added functionality to
 get all msgs from server

---
 src/components/accountScreen/accountScreen.js |  34 ++-
 src/components/settings/settings.js           |  11 +-
 src/reducers/Account.js                       |  25 +-
 src/reducers/Chat.js                          | 216 +++++-------------
 4 files changed, 99 insertions(+), 187 deletions(-)

diff --git a/src/components/accountScreen/accountScreen.js b/src/components/accountScreen/accountScreen.js
index 3ad286a..ae393e5 100644
--- a/src/components/accountScreen/accountScreen.js
+++ b/src/components/accountScreen/accountScreen.js
@@ -44,11 +44,15 @@ const getShort = str => {
 };
 
 const getShortTime = str => {
-    var value = str.getMinutes().toString();
-    if (value.length === 1) {
-        value += "0";
+    try{
+      var fullTime = str.split('T')[1];
+      var hour = fullTime.split(':')[0];
+      var minute = fullTime.split(':')[1];
+      return hour + ":" + minute;
+    }catch(ex){
+      return "-----";
     }
-    return str.getHours() + ':' + value;
+
 };
 
 const cardHeaderStyle = {
@@ -152,12 +156,19 @@ const NewText = function(props) {
                     hintText="Insert Text Message Here"
                     onKeyDown={e => {
                         if (e.key === 'Enter' && e.target.value.length > 0) {
+
                             props.addMsg(
                                 e.target.value,
                                 props.currentUser.userID,
                                 props.receiver.userID
                             );
+                            props.getUserChats();
+
                             e.target.value = '';
+                            setTimeout(function () {
+                              var objDiv = document.getElementById("theChat");
+                              objDiv.scrollTop =  objDiv.scrollHeight;
+                            }, 1);
                         }
                     }}
                     style={{
@@ -191,12 +202,13 @@ class AccountScreen extends Component {
         super(props);
         try{
             props.getCurrentUser();
+            var id = props.currentUser.userID;
         }
         catch(exc){
                 window.location.href = '/';
         }
 
-        props.getUserChats(this.props.allMsgs);
+        props.getUserChats();
         props.getMsgs(props.currentUser.userID, props.receiver.userID);
 
         this.filterList = this.filterList.bind(this);
@@ -267,11 +279,11 @@ class AccountScreen extends Component {
                     </ul>
                 </div>
 
-                <div className="mainBubbleContainer">
-                    {this.props.msgs.map(chat => {
+                <div id="theChat" className="mainBubbleContainer">
+                  {this.props.msgs.map(chat => {
                         if (
-                            chat.senderID === this.props.currentUser.userID &&
-                            chat.receiverID === this.props.receiver.userID
+                            chat.senderId === this.props.currentUser.userID &&
+                            chat.receiverId === this.props.receiver.userID
                         ) {
                             return (
                                 <div className="bubbleContainer">
@@ -280,8 +292,8 @@ class AccountScreen extends Component {
                                 </div>
                             );
                         } else if (
-                            chat.senderID === this.props.receiver.userID &&
-                            chat.receiverID === this.props.currentUser.userID
+                            chat.senderId === this.props.receiver.userID &&
+                            chat.receiverId === this.props.currentUser.userID
                         ) {
                             return (
                                 <div className="bubbleContainer">
diff --git a/src/components/settings/settings.js b/src/components/settings/settings.js
index 70e235a..9fb6217 100644
--- a/src/components/settings/settings.js
+++ b/src/components/settings/settings.js
@@ -56,11 +56,12 @@ class settings extends Component {
       super(props);
       props.getCurrentUser();
       try{
-        props.getCurrentUser();
-        }
-        catch(exc){
-                window.location.href = '/';
-        }
+          props.getCurrentUser();
+          var id = props.currentUser.userID;
+      }
+      catch(exc){
+              window.location.href = '/';
+      }
 
   }
 
diff --git a/src/reducers/Account.js b/src/reducers/Account.js
index 82e8094..7595f5a 100644
--- a/src/reducers/Account.js
+++ b/src/reducers/Account.js
@@ -1,6 +1,5 @@
 import axios from 'axios'
 
-
 export const USER_ACCOUNT = 'Account/USER_ACCOUNT';
 export const REGISTER_USER_ACCOUNT = 'Account/REGISTER_USER_ACCOUNT';
 export const LOGIN_USER_ACCOUNT = 'Account/LOGIN_USER_ACCOUNT';
@@ -113,12 +112,6 @@ export default (state = initialState, action) => {
             };
 
         case CURRENT_USER_ACCOUNT:
-            axios.get( state.api.host + ':'  + state.api.port + '/api/chats').then(function (response) {
-                console.log(response.data);
-            }).catch(function (error) {
-                alert(error);
-                console.log(error);
-            });
 
             return {
                 ...state
@@ -165,9 +158,9 @@ export default (state = initialState, action) => {
             let userChats = [];
 
             for (let msg of msgs) {
-                if (msg.recieverID === state.currentUser.userID) {
+                if (msg.recieverID === state.currentUser.userID || msg.senderId === state.currentUser.userID) {
                     for (let user of state.users) {
-                        if (msg.senderID === user.userID) {
+                        if (msg.senderId === user.userID || msg.receiverId === user.userID) {
                             if (userChats.length > 0) {
                                 let duplicatefound = false;
                                 for (let userDet of userChats) {
@@ -179,6 +172,7 @@ export default (state = initialState, action) => {
                                     }
                                 }
                                 if (!duplicatefound) {
+
                                     user.latestMessage = msg.text;
                                     user.selected = false;
                                     userChats.push(user);
@@ -188,10 +182,11 @@ export default (state = initialState, action) => {
                                 user.selected = false;
                                 userChats.push(user);
                             }
-                        }
+                          }
                     }
                 }
             }
+
             console.log(userChats);
             return {
                 ...state,
@@ -237,8 +232,8 @@ export const changeReciever = reciever => {
 };
 
 export const filterUserChats = updatedList => {
-    return dispatch => {
-        dispatch({ type: FILTER_USER_CHATS, updatedList: updatedList });
+  return dispatch => {
+      dispatch({ type: FILTER_USER_CHATS, updatedList: updatedList });
     };
 };
 
@@ -250,7 +245,11 @@ export const changeSelectedChat = tempChats => {
 
 export const getUserChats = allMsgs => {
     return dispatch => {
-        dispatch({ type: CURRENT_USER_CHATS, allMsgs: allMsgs });
+        axios.get(initialState.api.host + ':'  + initialState.api.port + '/api/chats').then(function (response) {
+          dispatch({ type: CURRENT_USER_CHATS, allMsgs: response.data });
+        }).catch(function (error) {
+
+      });
     };
 };
 
diff --git a/src/reducers/Chat.js b/src/reducers/Chat.js
index 24181fa..0c17608 100644
--- a/src/reducers/Chat.js
+++ b/src/reducers/Chat.js
@@ -1,125 +1,17 @@
 import { getUser } from './Account';
+import axios from 'axios'
 
 export const GET_CHATS = 'Chat/GET_CHATS';
 export const GET_MSGS = 'Chat/GET_MSGS';
 export const ADD_MSG = 'Chat/ADD_MSG';
 
 const initialState = {
+    api:{
+      host:'http://192.168.0.20',
+      port:54980
+    },
     msgs: [{}],
-    allMsgs: [
-        {
-            senderID: 20,
-            receiverID: 10,
-            sender: '',
-            receiver: '',
-            timeSent: new Date(),
-            text: 'This is from me to him'
-        },
-        {
-            senderID: 20,
-            receiverID: 10,
-            sender: '',
-            receiver: '',
-            timeSent: new Date(),
-            text: 'This is from me to him'
-        },
-        {
-            senderID: 20,
-            receiverID: 10,
-            sender: '',
-            receiver: '',
-            timeSent: new Date(),
-            text: 'This is from me to him'
-        },
-        {
-            senderID: 20,
-            receiverID: 10,
-            sender: '',
-            receiver: '',
-            timeSent: new Date(),
-            text: 'This is from me to him'
-        },
-        {
-            senderID: 20,
-            receiverID: 10,
-            sender: '',
-            receiver: '',
-            timeSent: new Date(),
-            text: 'This is from me to him'
-        },
-        {
-            senderID: 2,
-            receiverID: 10,
-            sender: '',
-            receiver: '',
-            timeSent: new Date(),
-            text: 'This is from him to someone'
-        },
-        {
-            senderID: 2,
-            receiverID: 10,
-            sender: '',
-            receiver: '',
-            timeSent: new Date(),
-            text: 'This is from him to someone'
-        },
-        {
-            senderID: 2,
-            receiverID: 10,
-            sender: '',
-            receiver: '',
-            timeSent: new Date(),
-            text: 'This is from him to someone'
-        },
-        {
-            senderID: 2,
-            receiverID: 10,
-            sender: '',
-            receiver: '',
-            timeSent: new Date(),
-            text: 'This is from him to someone'
-        },
-        {
-            senderID: 2,
-            receiverID: 10,
-            sender: '',
-            receiver: '',
-            timeSent: new Date(),
-            text: 'This is from him to someone'
-        },
-        {
-            senderID: 2,
-            recieverID: 20,
-            sender: '',
-            receiver: '',
-            timeSent: new Date(),
-            text: 'This is from her to me'
-        },
-        {
-            senderID: 10,
-            recieverID: 20,
-            sender: '',
-            receiver: '',
-            timeSent: new Date(),
-            text: 'This is from him to me'
-        },
-        {
-            senderID: 10,
-            recieverID: 20,
-            sender: '',
-            receiver: '',
-            timeSent: new Date(),
-            text: 'This is from him to me again'
-        },
-        {
-            senderID: 10,
-            receiverID: 1,
-            sender: '',
-            receiver: '',
-            timeSent: new Date(),
-            text: 'This is from me to someone'
-        }
-    ],
+    allMsgs: [{}],
     currentChat: [],
     chats: []
 };
@@ -127,49 +19,29 @@ const initialState = {
 export default (state = initialState, action) => {
     switch (action.type) {
         case ADD_MSG:
-            var newMsg = {
-                senderID: action.senderID,
-                receiverID: action.receiverID,
-                sender: getUser(action.senderID),
-                receiver: getUser(action.receiverID),
-                timeSent: new Date(),
-                text: action.msg
-            };
-
-            state.allMsgs.push(newMsg);
-            var chat = state.allMsgs.filter(msg => {
-                return (
-                    (msg.senderID === action.senderID && msg.receiverID === action.receiverID) ||
-                    (msg.senderID === action.receiverID && msg.senderID === action.receiverID)
-                );
-            });
-
+            alert("Check your log file");
+            console.log(action.results)
             return {
-                ...state,
-                msgs: chat
+                ...state
             };
 
         case GET_CHATS:
-            var chats = state.allMsgs.filter(msg => {
-                return msg.senderID === action.senderID;
-            });
-
+            var chats = action.chats;
+            state.chats = chats;
+            alert("got " + chats.length);
             return {
                 ...state,
                 chats: chats
             };
 
         case GET_MSGS:
-            var msgs = state.allMsgs.filter(msg => {
-                return (
-                    (msg.senderID === action.senderID && msg.receiverID === action.receiverID) ||
-                    (msg.senderID === action.receiverID && msg.senderID === action.receiverID)
-                );
-            });
+            //state.allMsgs = msgs;
+            state.allMsgs = action.msgs;
+            state.msgs = action.msgs;
 
             return {
                 ...state,
-                msgs: msgs
+                msgs: action.msgs
             };
 
         default:
@@ -179,30 +51,58 @@ export default (state = initialState, action) => {
 
 export const getChats = userID => {
     return dispatch => {
+      var msgs = []
+      axios.get(initialState.api.host + ':'  + initialState.api.port + '/api/chats/getchatsforuser/' + userID).then(function (response) {
         dispatch({
             type: GET_CHATS,
-            senderID: userID
+            senderId: userID,
+            chats:response.data
         });
+      }).catch(function (error) {
+
+      });
     };
 };
 
-export const getMsgs = (senderID, receiverID) => {
+export const getMsgs = (senderId, receiverId) => {
     return dispatch => {
-        dispatch({
-            type: GET_MSGS,
-            senderID: senderID,
-            receiverID: receiverID
-        });
+
+      var msgs = []
+      axios.get(initialState.api.host + ':'  + initialState.api.port + '/api/chats').then(function (response) {
+          dispatch({
+              type: GET_MSGS,
+              senderId: senderId,
+              receiverId: receiverId,
+              msgs:response.data
+          });
+      }).catch(function (error) {
+        alert("Error : sasasaffnasjfnaskjfasf ");
+        console.log(error);
+      });
     };
 };
 
-export const addMsg = (msg, senderID, receiverID) => {
+export const addMsg = (msg, senderId, receiverId) => {
     return dispatch => {
-        dispatch({
-            type: ADD_MSG,
-            msg: msg,
-            senderID: senderID,
-            receiverID: receiverID
-        });
+
+      var newMsg = {
+          SenderId: senderId,
+          ReceiverId: receiverId,
+          Text: msg
+      };
+      alert("Adding " + msg);
+      axios.post(initialState.api.host + ':'  + initialState.api.port + '/api/chats',newMsg).then(function (response) {
+          console.log(response);
+          alert("sent");
+          dispatch({
+              type: ADD_MSG,
+              msg: msg,
+              results:response.data
+          });
+          getMsgs(senderId, receiverId);
+      }).catch(function (error) {
+          alert("Error : safnasjfnaskjfasf ");
+          console.log(error);
+      });
     };
 };

From c9b2f0acc854024590cd641f9e4b9c38e86c8ea0 Mon Sep 17 00:00:00 2001
From: Lavhe <mulavhe@gmail.com>
Date: Fri, 12 Jan 2018 10:38:28 +0200
Subject: [PATCH 5/8] Ran prettier

---
 src/components/accountScreen/accountScreen.js |  42 +-
 src/components/headerNav/headerNav.js         | 229 +++++-----
 src/components/settings/settings.js           | 412 ++++++++++--------
 src/reducers/Account.js                       | 141 +++---
 src/reducers/Chat.js                          | 110 ++---
 5 files changed, 493 insertions(+), 441 deletions(-)

diff --git a/src/components/accountScreen/accountScreen.js b/src/components/accountScreen/accountScreen.js
index 600d705..6ff3e5a 100644
--- a/src/components/accountScreen/accountScreen.js
+++ b/src/components/accountScreen/accountScreen.js
@@ -10,7 +10,7 @@ import { connect } from 'react-redux';
 import FlatButton from 'material-ui/FlatButton/FlatButton';
 
 import {
-    getUser,
+    getUsers,
     changeUser,
     getCurrentUser,
     registerUser,
@@ -44,15 +44,14 @@ const getShort = str => {
 };
 
 const getShortTime = str => {
-  try{
-      var fullTime = str.split('T')[1];
-      var hour = fullTime.split(':')[0];
-      var minute = fullTime.split(':')[1];
-      return hour + ":" + minute;
-    }catch(ex){
-      return "-----";
+    try {
+        var fullTime = str.split('T')[1];
+        var hour = fullTime.split(':')[0];
+        var minute = fullTime.split(':')[1];
+        return hour + ':' + minute;
+    } catch (ex) {
+        return '-----';
     }
-
 };
 
 const cardHeaderStyle = {
@@ -156,7 +155,6 @@ const NewText = function(props) {
                     hintText="Insert Text Message Here"
                     onKeyDown={e => {
                         if (e.key === 'Enter' && e.target.value.length > 0) {
-
                             props.addMsg(
                                 e.target.value,
                                 props.currentUser.userID,
@@ -165,9 +163,9 @@ const NewText = function(props) {
                             props.getUserChats();
 
                             e.target.value = '';
-                            setTimeout(function () {
-                              var objDiv = document.getElementById("theChat");
-                              objDiv.scrollTop =  objDiv.scrollHeight;
+                            setTimeout(function() {
+                                var objDiv = document.getElementById('theChat');
+                                objDiv.scrollTop = objDiv.scrollHeight;
                             }, 1);
                         }
                     }}
@@ -203,18 +201,21 @@ class AccountScreen extends Component {
         try {
             props.getCurrentUser();
             var id = props.currentUser.userID;
-        }
-        catch(exc){
-                window.location.href = '/';
+        } catch (exc) {
+            window.location.href = '/';
         }
 
-        props.getUserChats();
+        props.getUsers();
         props.getMsgs(props.currentUser.userID, props.receiver.userID);
 
         this.filterList = this.filterList.bind(this);
         //this.state = { initialItems: initialItems, items: initialItems };
     }
 
+    componentWillReceiveProps(newProps) {
+        console.log(newProps);
+    }
+
     filterList = function(text) {
         var updatedList = this.props.currentUserChats;
         updatedList = updatedList.filter(function(item) {
@@ -246,13 +247,12 @@ class AccountScreen extends Component {
 
     render() {
         return (
-            <div className="auto">
+            <div>
                 <HeaderNav
                     pic={this.props.currentUser.userImg}
                     surname={this.props.currentUser.userSurname}
                     name={this.props.currentUser.userName}
                 />
-
                 <div className="leftPanelContainer">
                     <div className="searchContainer">
                         <SearchBar
@@ -280,7 +280,7 @@ class AccountScreen extends Component {
                 </div>
 
                 <div id="theChat" className="mainBubbleContainer">
-                  {this.props.msgs.map(chat => {
+                    {this.props.msgs.map(chat => {
                         if (
                             chat.senderId === this.props.currentUser.userID &&
                             chat.receiverId === this.props.receiver.userID
@@ -330,7 +330,7 @@ const mapStateToProps = state => {
 const mapDispatchToProps = dispatch =>
     bindActionCreators(
         {
-            getUser,
+            getUsers,
             getCurrentUser,
             changeUser,
             addMsg,
diff --git a/src/components/headerNav/headerNav.js b/src/components/headerNav/headerNav.js
index e2cb47f..aa07d22 100644
--- a/src/components/headerNav/headerNav.js
+++ b/src/components/headerNav/headerNav.js
@@ -11,22 +11,27 @@ import Popover from 'material-ui/Popover';
 import Menu from 'material-ui/Menu';
 
 import Avatar from 'material-ui/Avatar';
-import {List, ListItem} from 'material-ui/List';
+import { List, ListItem } from 'material-ui/List';
 import Subheader from 'material-ui/Subheader';
 
 import FlatButton from 'material-ui/FlatButton/FlatButton';
 
 import TextField from 'material-ui/TextField';
 
-import {Card, CardActions, CardHeader, CardMedia, CardTitle, CardText} from 'material-ui/Card';
+import { Card, CardActions, CardHeader, CardMedia, CardTitle, CardText } from 'material-ui/Card';
 
-import { getUser, changeUser, getCurrentUser, registerUser, loginUser ,logOut} from '../../reducers/Account';
+import {
+    getUser,
+    changeUser,
+    getCurrentUser,
+    registerUser,
+    loginUser,
+    logOut
+} from '../../reducers/Account';
 
 import { addMsg, getMsgs, getChats } from '../../reducers/Chat';
 
-
 class HeaderNav extends Component {
-
     constructor(props) {
         super(props);
         this.props = props;
@@ -38,9 +43,9 @@ class HeaderNav extends Component {
     }
 
     state = {
-      open:false,
-      txtSearch:''
-    }
+        open: false,
+        txtSearch: ''
+    };
 
     handleChange = (event, logged) => {
         this.setState({ logged: logged });
@@ -54,16 +59,15 @@ class HeaderNav extends Component {
         'padding-bottom': '2px'
     };
 
-
-render() {
+    render() {
         return (
             <div class="navBar">
                 <Route
                     render={({ history }) => (
                         <div
                             class="newChat initial"
-                            onMouseEnter={(e) =>{
-                                this.setState({ open: true })
+                            onMouseEnter={e => {
+                                this.setState({ open: true });
                             }}
                             onClick={() => {
                                 history.push('/accountScreen');
@@ -74,75 +78,91 @@ render() {
                     )}
                 />
 
-                    
-                              <Popover
-                                open={this.state.open}
-                                anchorOrigin={{horizontal: 'right', vertical: 'bottom'}}
-                                targetOrigin={{horizontal: 'right', vertical: 'bottom'}}
-                                onRequestClose={this.handleRequestClose}>
-                                  <Card>
-                                      <CardTitle title="Search for a user"/>
-                                      <CardText>
-                                        <div>
-                                          <FlatButton label="X" onClick={(e)=>{ this.setState({ open: false })}}>
-
-                                          </FlatButton>
-                                        </div>
-                                        <TextField
-                                            hintText="Friend's Email"
-                                            onKeyDown={e => {
-                                                if (e.key === 'Enter' && e.target.value.length > 0) {
-                                                    e.target.value = '';
-                                                }
-                                                this.setState({txtSearch : e.target.value});
-
-                                            }}
-                                            style={{
-                                                padding: '1px 0px 1px 25px',
-                                                width: '100%'
-                                            }}
-                                        />
-                                      </CardText>
-                                    </Card>
-                                    <List>
-                                      <Subheader>Users that contains : { this.state.txtSearch } </Subheader>
-                                      <Route render={({ history }) => (
-                                           this.props.users.map(user =>(
-                                              (user.userEmail.indexOf(this.state.txtSearch) !== -1) ||
-                                              (user.userSurname.indexOf(this.state.txtSearch) !== -1) ||
-                                              (user.userName.indexOf(this.state.txtSearch) !== -1) ?
-
-                                                      <ListItem
-                                                        leftAvatar={
-                                                          <Avatar src={ user.userImg } />
+                <Popover
+                    open={this.state.open}
+                    anchorOrigin={{ horizontal: 'right', vertical: 'bottom' }}
+                    targetOrigin={{ horizontal: 'right', vertical: 'bottom' }}
+                    onRequestClose={this.handleRequestClose}
+                >
+                    <Card>
+                        <CardTitle title="Search for a user" />
+                        <CardText>
+                            <div>
+                                <FlatButton
+                                    label="X"
+                                    onClick={e => {
+                                        this.setState({ open: false });
+                                    }}
+                                />
+                            </div>
+                            <TextField
+                                hintText="Friend's Email"
+                                onKeyDown={e => {
+                                    if (e.key === 'Enter' && e.target.value.length > 0) {
+                                        e.target.value = '';
+                                    }
+                                    this.setState({ txtSearch: e.target.value });
+                                }}
+                                style={{
+                                    padding: '1px 0px 1px 25px',
+                                    width: '100%'
+                                }}
+                            />
+                        </CardText>
+                    </Card>
+                    <List>
+                        <Subheader>Users that contains : {this.state.txtSearch} </Subheader>
+                        <Route
+                            render={({ history }) =>
+                                this.props.users.map(
+                                    user =>
+                                        user.userEmail.indexOf(this.state.txtSearch) !== -1 ||
+                                        user.userSurname.indexOf(this.state.txtSearch) !== -1 ||
+                                        user.userName.indexOf(this.state.txtSearch) !== -1 ? (
+                                            <ListItem
+                                                leftAvatar={<Avatar src={user.userImg} />}
+                                                primaryText={user.userSurname + ' ' + user.userName}
+                                                secondaryText={user.userEmail}
+                                                onClick={e => {
+                                                    let found = false;
+                                                    for (
+                                                        let i = 0;
+                                                        i < this.props.msgs.length;
+                                                        i++
+                                                    ) {
+                                                        if (
+                                                            (this.props.msgs[i].senderID ===
+                                                                this.props.currentUser.userID &&
+                                                                this.props.msgs[i].receiverID ===
+                                                                    user.userID) ||
+                                                            (this.props.msgs[i].receiverID ===
+                                                                this.props.currentUser.userID &&
+                                                                this.props.msgs[i].senderID ===
+                                                                    user.userID)
+                                                        ) {
+                                                            found = true;
                                                         }
-                                                        primaryText={ user.userSurname + " " + user.userName}
-                                                        secondaryText={ user.userEmail }
-                                                        onClick={(e)=>{
-                                                          let found = false;
-                                                          for(let i=0;i<this.props.msgs.length;i++){
-                                                            if(this.props.msgs[i].senderID === this.props.currentUser.userID && this.props.msgs[i].receiverID === user.userID ||
-                                                               this.props.msgs[i].receiverID === this.props.currentUser.userID && this.props.msgs[i].senderID === user.userID){
-                                                              found = true;
-                                                            }
-                                                          }
-                                                          if(!found){
-                                                            this.props.addMsg("Hi",this.props.currentUser.userID,user.userID);
-                                                          }
-                                                          history.push('/accountScreen');
-                                                          this.setState({open:false});
-                                                        }}
-                                                      />
-                                          :
-
-                                          <p></p>
-
-                                          ))
-                                      )} />
-                                     </List>
-                              </Popover>
-
-                    
+                                                    }
+                                                    if (!found) {
+                                                        this.props.addMsg(
+                                                            'Hi',
+                                                            this.props.currentUser.userID,
+                                                            user.userID
+                                                        );
+                                                    }
+                                                    history.push('/accountScreen');
+                                                    this.setState({ open: false });
+                                                }}
+                                            />
+                                        ) : (
+                                            <p />
+                                        )
+                                )
+                            }
+                        />
+                    </List>
+                </Popover>
+
                 <div className="newChat initial" primary={true} onClick={() => {}}>
                     <label className="newGroupLbl">NEW GROUP</label>
                 </div>
@@ -203,29 +223,30 @@ render() {
     }
 }
 
-
-const mapStateToProps = state =>
-{
-  return {
-    chats: state.Chat.chats,
-    msgs: state.Chat.msgs,
-    currentUser: state.Account.currentUser,
-    users: state.Account.users,
-    receiver: state.Account.receiver
-  };
+const mapStateToProps = state => {
+    return {
+        chats: state.Chat.chats,
+        msgs: state.Chat.msgs,
+        currentUser: state.Account.currentUser,
+        users: state.Account.users,
+        receiver: state.Account.receiver
+    };
 };
 
-const mapDispatchToProps = dispatch => bindActionCreators({
-    getUser,
-    getCurrentUser,
-    changeUser,
-    addMsg,
-    getMsgs,
-    registerUser,
-    loginUser,
-    getChats,
-    logOut
-  }, dispatch);
-
-
-export default connect(mapStateToProps, mapDispatchToProps)(HeaderNav);
\ No newline at end of file
+const mapDispatchToProps = dispatch =>
+    bindActionCreators(
+        {
+            getUser,
+            getCurrentUser,
+            changeUser,
+            addMsg,
+            getMsgs,
+            registerUser,
+            loginUser,
+            getChats,
+            logOut
+        },
+        dispatch
+    );
+
+export default connect(mapStateToProps, mapDispatchToProps)(HeaderNav);
diff --git a/src/components/settings/settings.js b/src/components/settings/settings.js
index 017d1dc..83ee2c7 100644
--- a/src/components/settings/settings.js
+++ b/src/components/settings/settings.js
@@ -1,11 +1,11 @@
-import React, {Component} from 'react';
-import {GridList, GridTile} from 'material-ui/GridList';
+import React, { Component } from 'react';
+import { GridList, GridTile } from 'material-ui/GridList';
 import IconButton from 'material-ui/IconButton';
 import ActionDone from 'material-ui/svg-icons/action/done';
 import EditorModeEdit from 'material-ui/svg-icons/editor/mode-edit';
 import TextField from 'material-ui/TextField';
 
-import { Route } from 'react-router-dom'
+import { Route } from 'react-router-dom';
 
 import { bindActionCreators } from 'redux';
 import { connect } from 'react-redux';
@@ -14,85 +14,89 @@ import HeaderNav from '../headerNav/headerNav';
 import '../headerNav/headerNav.css';
 
 import {
-  getUser,
-  changeUser,
-  getCurrentUser,
-  registerUser,
-  loginUser,
-  logOut
+    getUser,
+    changeUser,
+    getCurrentUser,
+    registerUser,
+    loginUser,
+    logOut
 } from '../../reducers/Account';
 
-import {addMsg, getMsgs, getChats} from '../../reducers/Chat';
+import { addMsg, getMsgs, getChats } from '../../reducers/Chat';
 
 const styles = {
-  gridList: {
-    width: '100%',
-    overflowX: 'auto'
-  }
+    gridList: {
+        width: '100%',
+        overflowX: 'auto'
+    }
 };
 
 class settings extends Component {
+    changeImg = e => {
+        console.log(e.target);
+        console.log(e.target.files[0]);
+
+        if (e.target.files && e.target.files[0]) {
+            let reader = new FileReader();
+            reader.onload = event => {
+                this.setState({ profilephoto: event.target.result });
+            };
+            reader.readAsDataURL(e.target.files[0]);
+        }
+        this.setState({ hasimg: true });
+        this.props.changeUser({ userImg: this.state.profilephoto });
+
+        this.props.getCurrentUser();
+        this.forceUpdate();
+    };
+
+    constructor(props) {
+        super(props);
+        props.getCurrentUser();
+        try {
+            props.getCurrentUser();
+            var id = props.currentUser.userID;
+        } catch (exc) {
+            window.location.href = '/';
+        }
+    }
 
-  changeImg = (e) => {
-    console.log(e.target);
-    console.log(e.target.files[0]);
-
-    if (e.target.files && e.target.files[0]) {
-        let reader = new FileReader();
-        reader.onload = event => {
-            this.setState({ profilephoto: event.target.result });
-        };
-        reader.readAsDataURL(e.target.files[0]);
+    saveChanges() {
+        this.props.changeUser({
+            userName: this.state.user.name,
+            userSurname: this.state.user.surname
+        });
 
+        this.forceUpdate();
+        this.props.getCurrentUser();
     }
-    this.setState({ hasimg: true });
-    this.props.changeUser({userImg:this.state.profilephoto});
-
-    this.props.getCurrentUser();
-    this.forceUpdate();
-}
 
-  constructor(props){
-      super(props);
-      props.getCurrentUser();
-      try{
-          props.getCurrentUser();
-          var id = props.currentUser.userID;
-      }
-      catch(exc){
-              window.location.href = '/';
-      }
-
-  }
-
-  saveChanges() {
-    this.props.changeUser({userName:this.state.user.name, userSurname:this.state.user.surname});
-
-    this.forceUpdate();
-    this.props.getCurrentUser();
-  }
-
-  state = {
-    editingEmail: false,
-    editingNames: false,
-    profilephoto:'',
-    user:'',
-    hasimg: true,
-  };
-
-  render() {
-    return (
-    <div>
-        <HeaderNav pic={ this.props.currentUser.userImg } surname={ this.props.currentUser.userSurname  } name={ this.props.currentUser.userName } { ...this.props }></HeaderNav>
-         <GridList cols={1} cellHeight={80} style={styles.gridList}>
-        <GridTile className="text-center" cols={1} rows={4}>
-        <div className="proImgPlaceholder" >
-                        <div>
-                              <img
-                              src={ this.props.currentUser.userImg }
-                              className="proImg"
-                              alt="Profile"
-                          ></img>
+    state = {
+        editingEmail: false,
+        editingNames: false,
+        profilephoto: '',
+        user: '',
+        hasimg: true
+    };
+
+    render() {
+        return (
+            <div>
+                <HeaderNav
+                    pic={this.props.currentUser.userImg}
+                    surname={this.props.currentUser.userSurname}
+                    name={this.props.currentUser.userName}
+                    {...this.props}
+                />
+                <GridList cols={1} cellHeight={80} style={styles.gridList}>
+                    <GridTile className="text-center" cols={1} rows={4}>
+                        <div className="proImgPlaceholder">
+                            <div>
+                                <img
+                                    src={this.props.currentUser.userImg}
+                                    className="proImg"
+                                    alt="Profile"
+                                />
                                 <input
                                     type="file"
                                     onChange={e => {
@@ -100,134 +104,162 @@ class settings extends Component {
                                     }}
                                     style={inputimg}
                                 />
-                                </div>
-
-                    </div>
-
+                            </div>
+                        </div>
 
-         {/* <div className="proImgPlaceholder">
+                        {/* <div className="proImgPlaceholder">
          <img className="proImg"
              src={this.props.currentUser.userImg}/>
             </div> */}
+                    </GridTile>
 
-        </GridTile>
-
-        <GridTile className="text-center" cols={1} rows={1}>
-          <div>
-            {
-              this.state.editingNames
-                ? <div>
-                    <TextField onChange={(e) => {
-                        var newSelected = this.props.currentUser;
-                        newSelected.surname = e.target.value.split(' ')[0]
-                        newSelected.name = e.target.value.split(' ')[1]
-                        this.setState({user: newSelected})
-                      }} hintText="Surname Name"/>
-                    <IconButton onClick={() => {
-                        this.saveChanges();
-                        this.setState({editingNames: false});
-                      }} iconStyle={styles.mediumIcon} style={styles.medium}>
-                      <ActionDone/>
-                    </IconButton>
-                  </div>
-                : <div>
-
-                    <label className="userTitleText">
-                      {this.props.currentUser.userSurname} {this.props.currentUser.userName}
-                    </label>
-                    <label className="nameLbl">
-                      {this.props.currentUser.userName} {this.props.currentUser.userSurname}
-                    </label>
-
-                    <IconButton onClick={() => {
-                        this.setState({editingNames: true})
-                      }} iconStyle={styles.mediumIcon} style={styles.medium}>
-                      <EditorModeEdit/>
-                    </IconButton>
-                  </div>
-
-
-            }
-          </div>
-
-        </GridTile>
-
-        <GridTile className="text-center" cols={1} rows={1}>
-          <div>
-            {
-              this.state.editingEmail
-                ? <div>
-                    <TextField onChange={(e) => {
-                        var newSelected = this.props.currentUser;
-                        newSelected.email = e.target.value
-                        this.setState({user: newSelected})
-                      }} hintText="Email Address"/>
-                    <IconButton onClick={() => {
-                        this.saveChanges();
-                        this.setState({editingEmail: false})
-                      }} iconStyle={styles.mediumIcon} style={styles.medium}>
-                      <ActionDone/>
-                    </IconButton>
-                  </div>
-                : <div>
-                    <label className="userTitleText">
-                      {this.props.currentUser.userEmail}
-                    </label>
-                    <IconButton onClick={() => {
-                        this.setState({editingEmail: true})
-                      }} iconStyle={styles.mediumIcon} style={styles.medium}>
-                      <EditorModeEdit/>
-                    </IconButton>
-                  </div>
-            }
-          </div>
-        </GridTile>
-
-        <GridTile className="text-center" cols={1} rows={2}>
-        <Route render={({ history }) => (
-          <div className="doneBtn" onClick={() => {
-            history.push('/accountScreen')
-            }} label="Done" secondary={true}>
-            <label className="doneLbl">DONE</label>
-          </div>
-        )} />
-
-        </GridTile>
-      </GridList>
-    </div>);
-  }
+                    <GridTile className="text-center" cols={1} rows={1}>
+                        <div>
+                            {this.state.editingNames ? (
+                                <div>
+                                    <TextField
+                                        onChange={e => {
+                                            var newSelected = this.props.currentUser;
+                                            newSelected.surname = e.target.value.split(' ')[0];
+                                            newSelected.name = e.target.value.split(' ')[1];
+                                            this.setState({ user: newSelected });
+                                        }}
+                                        hintText="Surname Name"
+                                    />
+                                    <IconButton
+                                        onClick={() => {
+                                            this.saveChanges();
+                                            this.setState({ editingNames: false });
+                                        }}
+                                        iconStyle={styles.mediumIcon}
+                                        style={styles.medium}
+                                    >
+                                        <ActionDone />
+                                    </IconButton>
+                                </div>
+                            ) : (
+                                <div>
+                                    <label className="userTitleText">
+                                        {this.props.currentUser.userSurname}{' '}
+                                        {this.props.currentUser.userName}
+                                    </label>
+                                    <label className="nameLbl">
+                                        {this.props.currentUser.userName}{' '}
+                                        {this.props.currentUser.userSurname}
+                                    </label>
+
+                                    <IconButton
+                                        onClick={() => {
+                                            this.setState({ editingNames: true });
+                                        }}
+                                        iconStyle={styles.mediumIcon}
+                                        style={styles.medium}
+                                    >
+                                        <EditorModeEdit />
+                                    </IconButton>
+                                </div>
+                            )}
+                        </div>
+                    </GridTile>
+
+                    <GridTile className="text-center" cols={1} rows={1}>
+                        <div>
+                            {this.state.editingEmail ? (
+                                <div>
+                                    <TextField
+                                        onChange={e => {
+                                            var newSelected = this.props.currentUser;
+                                            newSelected.email = e.target.value;
+                                            this.setState({ user: newSelected });
+                                        }}
+                                        hintText="Email Address"
+                                    />
+                                    <IconButton
+                                        onClick={() => {
+                                            this.saveChanges();
+                                            this.setState({ editingEmail: false });
+                                        }}
+                                        iconStyle={styles.mediumIcon}
+                                        style={styles.medium}
+                                    >
+                                        <ActionDone />
+                                    </IconButton>
+                                </div>
+                            ) : (
+                                <div>
+                                    <label className="userTitleText">
+                                        {this.props.currentUser.userEmail}
+                                    </label>
+                                    <IconButton
+                                        onClick={() => {
+                                            this.setState({ editingEmail: true });
+                                        }}
+                                        iconStyle={styles.mediumIcon}
+                                        style={styles.medium}
+                                    >
+                                        <EditorModeEdit />
+                                    </IconButton>
+                                </div>
+                            )}
+                        </div>
+                    </GridTile>
+
+                    <GridTile className="text-center" cols={1} rows={2}>
+                        <Route
+                            render={({ history }) => (
+                                <div
+                                    className="doneBtn"
+                                    onClick={() => {
+                                        history.push('/accountScreen');
+                                    }}
+                                    label="Done"
+                                    secondary={true}
+                                >
+                                    <label className="doneLbl">DONE</label>
+                                </div>
+                            )}
+                        />
+                    </GridTile>
+                </GridList>
+            </div>
+        );
+    }
 }
 
 const inputimg = {
-  opacity: 0,
-  position: 'absolute',
-  top: 0,
-  bottom: 0,
-  left: 0,
-  right: 0,
-  width: '100%'
+    opacity: 0,
+    position: 'absolute',
+    top: 0,
+    bottom: 0,
+    left: 0,
+    right: 0,
+    width: '100%'
 };
 
-const mapStateToProps = state =>
-{
-  return {chats: state.Chat.chats,
-    msgs: state.Chat.msgs,
-    currentUser: state.Account.currentUser,
-    users: state.Account.users,
-    receiver: state.Account.receiver
-  };
+const mapStateToProps = state => {
+    return {
+        chats: state.Chat.chats,
+        msgs: state.Chat.msgs,
+        currentUser: state.Account.currentUser,
+        users: state.Account.users,
+        receiver: state.Account.receiver
+    };
 };
 
-const mapDispatchToProps = dispatch => bindActionCreators({
-  getUser,
-  getCurrentUser,
-  changeUser,
-  addMsg,
-  getMsgs,
-  registerUser,
-  loginUser,
-  getChats,
-  logOut
-}, dispatch);
-
-export default connect(mapStateToProps, mapDispatchToProps)(settings);
\ No newline at end of file
+const mapDispatchToProps = dispatch =>
+    bindActionCreators(
+        {
+            getUser,
+            getCurrentUser,
+            changeUser,
+            addMsg,
+            getMsgs,
+            registerUser,
+            loginUser,
+            getChats,
+            logOut
+        },
+        dispatch
+    );
+
+export default connect(mapStateToProps, mapDispatchToProps)(settings);
diff --git a/src/reducers/Account.js b/src/reducers/Account.js
index 73bffe4..99b17d7 100644
--- a/src/reducers/Account.js
+++ b/src/reducers/Account.js
@@ -1,4 +1,4 @@
-import axios from 'axios'
+import axios from 'axios';
 
 export const USER_ACCOUNT = 'Account/USER_ACCOUNT';
 export const REGISTER_USER_ACCOUNT = 'Account/REGISTER_USER_ACCOUNT';
@@ -10,11 +10,12 @@ export const CURRENT_USER_CHATS = 'Account/CURRENT_USER_CHATS';
 export const FILTER_USER_CHATS = 'Account/FILTER_USER_CHATS';
 export const CHANGE_SELECTED_CHAT = 'Account/CHANGE_SELECTED_CHAT';
 export const CHANGE_RECIEVER = 'Account/CHANGE_RECIEVER';
+export const ALL_USERS = 'Account/ALL_USERS';
 
 const initialState = {
-    api:{
-      host:'http://192.168.0.20',
-      port:54980
+    api: {
+        host: 'http://192.168.0.20',
+        port: 54980
     },
     currentUserChats: [],
     filteredChats: [],
@@ -28,63 +29,35 @@ const initialState = {
         userImg:
             'https://images.duckduckgo.com/iu/?u=https%3A%2F%2Fpbs.twimg.com%2Fprofile_images%2F1396485177%2Ftrevor_cartoon_profile.jpg&f=1'
     },
-    users: [
-        {
-            userID: 20,
-            userName: 'Joe',
-            userSurname: 'Sirwali',
-            userPassword: 'joe',
-            userEmail: 'joe@gmail.com',
-            userImg:
-                'https://images.duckduckgo.com/iu/?u=https%3A%2F%2Fpbs.twimg.com%2Fprofile_images%2F1396485177%2Ftrevor_cartoon_profile.jpg&f=1'
-        },
-        {
-            userID: 10,
-            userName: 'Takie',
-            userSurname: 'Ndou',
-            userEmail: 'mulavhe@gmail.com',
-            userPassword: 'joseph',
-            userImg:
-                'https://images.duckduckgo.com/iu/?u=https%3A%2F%2Fpbs.twimg.com%2Fprofile_images%2F1396485177%2Ftrevor_cartoon_profile.jpg&f=1',
-            latestMessage: ''
-        },
-        {
-            userID: 2,
-            userName: 'Rendani',
-            userSurname: 'Sirwali',
-            userEmail: 'mulavhe@gmail.com',
-            userImg:
-                'https://images.duckduckgo.com/iu/?u=https%3A%2F%2Fpbs.twimg.com%2Fprofile_images%2F1396485177%2Ftrevor_cartoon_profile.jpg&f=1'
-        },
-        {
-            userID: 4,
-            userName: 'Joseph',
-            userSurname: 'Sirwali',
-            userEmail: 'mulavhe@gmail.com',
-            userImg:
-                'https://images.duckduckgo.com/iu/?u=https%3A%2F%2Fpbs.twimg.com%2Fprofile_images%2F1396485177%2Ftrevor_cartoon_profile.jpg&f=1'
-        },
-        {
-            userID: 0,
-            userName: 'Joseph',
-            userSurname: 'Sirwali',
-            userEmail: 'mulavhe@gmail.com',
-            userImg:
-                'https://images.duckduckgo.com/iu/?u=https%3A%2F%2Fpbs.twimg.com%2Fprofile_images%2F1396485177%2Ftrevor_cartoon_profile.jpg&f=1'
-        },
-        {
-            userID: 10,
-            userName: 'Victim',
-            userSurname: 'That',
-            userEmail: 'mulavhe@gmail.com',
-            userImg:
-                'https://images.duckduckgo.com/iu/?u=https%3A%2F%2Fpbs.twimg.com%2Fprofile_images%2F1396485177%2Ftrevor_cartoon_profile.jpg&f=1'
-        }
-    ]
+    users: []
 };
 
 export default (state = initialState, action) => {
     switch (action.type) {
+        case ALL_USERS:
+            alert('Got all users');
+            console.log('Got all users');
+
+            var users = [];
+
+            for (let i = 0; i < action.users.length; i++) {
+                alert(i + ' index');
+                users.push({
+                    userID: action.users[i].id,
+                    userName: action.users[i].name,
+                    userSurname: action.users[i].surname,
+                    userImg: action.users[i].image,
+                    userEmail: action.users[i].email
+                });
+            }
+
+            alert(users.length + ' users in db');
+
+            return {
+                ...state,
+                users: users
+            };
+
         case REGISTER_USER_ACCOUNT:
             var user = null;
             user = action.user;
@@ -112,22 +85,17 @@ export default (state = initialState, action) => {
             };
 
         case CURRENT_USER_ACCOUNT:
-
             return {
                 ...state
             };
 
         case USER_ACCOUNT:
-            user = null;
-            for (let i = 0; i < state.users.length; i++) {
-                if (state.users[i].userID === action.ID) {
-                    user = state.users[i];
-                }
-            }
-
+            alert('here ....');
+            console.log('here ....');
+            console.log(action.user);
             return {
                 ...state,
-                currentUser: user
+                currentUser: action.user
             };
 
         case CHANGE_USER_ACCOUNT:
@@ -158,7 +126,10 @@ export default (state = initialState, action) => {
             let userChats = [];
 
             for (let msg of msgs) {
-                if (msg.recieverID === state.currentUser.userID || msg.senderId === state.currentUser.userID) {
+                if (
+                    msg.recieverID === state.currentUser.userID ||
+                    msg.senderId === state.currentUser.userID
+                ) {
                     for (let user of state.users) {
                         if (msg.senderId === user.userID || msg.receiverId === user.userID) {
                             if (userChats.length > 0) {
@@ -172,7 +143,6 @@ export default (state = initialState, action) => {
                                     }
                                 }
                                 if (!duplicatefound) {
-
                                     user.latestMessage = msg.text;
                                     user.selected = false;
                                     userChats.push(user);
@@ -182,7 +152,7 @@ export default (state = initialState, action) => {
                                 user.selected = false;
                                 userChats.push(user);
                             }
-                          }
+                        }
                     }
                 }
             }
@@ -221,7 +191,11 @@ export default (state = initialState, action) => {
 
 export const getUser = userID => {
     return dispatch => {
-        dispatch({ type: USER_ACCOUNT, ID: userID });
+        axios
+            .get(initialState.api.host + ':' + initialState.api.port + 'api/Users/' + userID)
+            .then(function(response) {
+                dispatch({ type: USER_ACCOUNT, user: response.data });
+            });
     };
 };
 
@@ -232,8 +206,8 @@ export const changeReciever = reciever => {
 };
 
 export const filterUserChats = updatedList => {
-  return dispatch => {
-      dispatch({ type: FILTER_USER_CHATS, updatedList: updatedList });
+    return dispatch => {
+        dispatch({ type: FILTER_USER_CHATS, updatedList: updatedList });
     };
 };
 
@@ -243,13 +217,26 @@ export const changeSelectedChat = tempChats => {
     };
 };
 
-export const getUserChats = allMsgs => {
+export const getUsers = () => {
     return dispatch => {
-        axios.get(initialState.api.host + ':'  + initialState.api.port + '/api/chats').then(function (response) {
-          dispatch({ type: CURRENT_USER_CHATS, allMsgs: response.data });
-        }).catch(function (error) {
+        alert('About to');
+        axios
+            .get(initialState.api.host + ':' + initialState.api.port + '/api/Users/GetAllUsers')
+            .then(function(response) {
+                dispatch({ type: ALL_USERS, users: response.data });
+            })
+            .catch(function(error) {});
+    };
+};
 
-      });
+export const getUserChats = allMsgs => {
+    return dispatch => {
+        axios
+            .get(initialState.api.host + ':' + initialState.api.port + '/api/chats')
+            .then(function(response) {
+                dispatch({ type: CURRENT_USER_CHATS, allMsgs: response.data });
+            })
+            .catch(function(error) {});
     };
 };
 
diff --git a/src/reducers/Chat.js b/src/reducers/Chat.js
index 0c17608..f7dcfc4 100644
--- a/src/reducers/Chat.js
+++ b/src/reducers/Chat.js
@@ -1,14 +1,14 @@
 import { getUser } from './Account';
-import axios from 'axios'
+import axios from 'axios';
 
 export const GET_CHATS = 'Chat/GET_CHATS';
 export const GET_MSGS = 'Chat/GET_MSGS';
 export const ADD_MSG = 'Chat/ADD_MSG';
 
 const initialState = {
-    api:{
-      host:'http://192.168.0.20',
-      port:54980
+    api: {
+        host: 'http://192.168.0.20',
+        port: 54980
     },
     msgs: [{}],
     allMsgs: [{}],
@@ -19,8 +19,8 @@ const initialState = {
 export default (state = initialState, action) => {
     switch (action.type) {
         case ADD_MSG:
-            alert("Check your log file");
-            console.log(action.results)
+            alert('Check your log file');
+            console.log(action.results);
             return {
                 ...state
             };
@@ -28,7 +28,7 @@ export default (state = initialState, action) => {
         case GET_CHATS:
             var chats = action.chats;
             state.chats = chats;
-            alert("got " + chats.length);
+            alert('got ' + chats.length);
             return {
                 ...state,
                 chats: chats
@@ -51,58 +51,70 @@ export default (state = initialState, action) => {
 
 export const getChats = userID => {
     return dispatch => {
-      var msgs = []
-      axios.get(initialState.api.host + ':'  + initialState.api.port + '/api/chats/getchatsforuser/' + userID).then(function (response) {
-        dispatch({
-            type: GET_CHATS,
-            senderId: userID,
-            chats:response.data
-        });
-      }).catch(function (error) {
-
-      });
+        var msgs = [];
+        axios
+            .get(
+                initialState.api.host +
+                    ':' +
+                    initialState.api.port +
+                    '/api/chats/getchatsforuser/' +
+                    userID
+            )
+            .then(function(response) {
+                dispatch({
+                    type: GET_CHATS,
+                    senderId: userID,
+                    chats: response.data
+                });
+            })
+            .catch(function(error) {});
     };
 };
 
 export const getMsgs = (senderId, receiverId) => {
     return dispatch => {
-
-      var msgs = []
-      axios.get(initialState.api.host + ':'  + initialState.api.port + '/api/chats').then(function (response) {
-          dispatch({
-              type: GET_MSGS,
-              senderId: senderId,
-              receiverId: receiverId,
-              msgs:response.data
-          });
-      }).catch(function (error) {
-        alert("Error : sasasaffnasjfnaskjfasf ");
-        console.log(error);
-      });
+        var msgs = [];
+        axios
+            .get(initialState.api.host + ':' + initialState.api.port + '/api/chats')
+            .then(function(response) {
+                dispatch({
+                    type: GET_MSGS,
+                    senderId: senderId,
+                    receiverId: receiverId,
+                    msgs: response.data
+                });
+            })
+            .catch(function(error) {
+                alert('Error : sasasaffnasjfnaskjfasf ');
+                console.log(error);
+            });
     };
 };
 
 export const addMsg = (msg, senderId, receiverId) => {
     return dispatch => {
+        var newMsg = {
+            SenderId: senderId,
+            ReceiverId: receiverId,
+            Text: msg
+        };
+
+        axios
+            .post(initialState.api.host + ':' + initialState.api.port + '/api/chats', newMsg)
+            .then(function(response) {
+                console.log(response);
+                alert('sent');
+                dispatch({
+                    type: ADD_MSG,
+                    msg: msg,
+                    results: response.data
+                });
 
-      var newMsg = {
-          SenderId: senderId,
-          ReceiverId: receiverId,
-          Text: msg
-      };
-      alert("Adding " + msg);
-      axios.post(initialState.api.host + ':'  + initialState.api.port + '/api/chats',newMsg).then(function (response) {
-          console.log(response);
-          alert("sent");
-          dispatch({
-              type: ADD_MSG,
-              msg: msg,
-              results:response.data
-          });
-          getMsgs(senderId, receiverId);
-      }).catch(function (error) {
-          alert("Error : safnasjfnaskjfasf ");
-          console.log(error);
-      });
+                getMsgs(senderId, receiverId);
+            })
+            .catch(function(error) {
+                alert('Error : safnasjfnaskjfasf ');
+                console.log(error);
+            });
     };
 };

From 95c2210e2b483702f91a1a0e89ce3d7631641fb9 Mon Sep 17 00:00:00 2001
From: Lavhe <mulavhe@gmail.com>
Date: Fri, 12 Jan 2018 10:53:51 +0200
Subject: [PATCH 6/8] Simplified the Axios link and added a few get() {Not done
 yet}

---
 src/components/login/loginIndex.js       | 221 ++++++++++++-----------
 src/components/login/validate.js         |  20 +-
 src/components/registration/stepOne.js   | 193 ++++++++++----------
 src/components/registration/stepThree.js | 110 +++++------
 src/components/registration/stepTwo.js   | 174 +++++++++---------
 src/reducers/Account.js                  |  78 ++++----
 src/reducers/Chat.js                     |  15 +-
 7 files changed, 395 insertions(+), 416 deletions(-)

diff --git a/src/components/login/loginIndex.js b/src/components/login/loginIndex.js
index 7aaef0d..2a7626c 100644
--- a/src/components/login/loginIndex.js
+++ b/src/components/login/loginIndex.js
@@ -1,124 +1,129 @@
 import React from 'react';
 
-import { Route } from 'react-router-dom';
-
+import {Route} from 'react-router-dom'
 import TextField from 'material-ui/TextField';
 import FlatButton from 'material-ui/FlatButton';
 import './loginIndex.css';
 
-import { bindActionCreators } from 'redux';
-import { connect } from 'react-redux';
+import { bindActionCreators } from 'redux'
+import { connect } from 'react-redux'
+
+import {
+  getUser,
+  changeUser,
+  getCurrentUser,
+  registerUser,
+  loginUser
+} from '../../reducers/Account'
 
 import {
-    getUser,
-    changeUser,
-    getCurrentUser,
-    registerUser,
-    loginUser
-} from '../../reducers/Account';
+  addMsg,
+  getMsgs,
+  getChats
+} from '../../reducers/Chat'
 
-import { addMsg, getMsgs, getChats } from '../../reducers/Chat';
 
-let email = '';
-let password = '';
+	let email =  ""
+	let password = ""
 
 const Login = props => (
-    <div className="back">
-        <div className="backBox">
-            <div className="bottomBox">
-                <div>
-                    <Route
-                        render={({ history }) => (
-                            <FlatButton
-                                className="noAccountYetGet"
-                                label="No account yet? Get setup now >"
-                                onClick={() => {
-                                    history.push('/StepOne');
-                                }}
-                            />
-                        )}
-                    />
-                </div>
-            </div>
-            <div className="welcomeToThe">Welcome to the</div>
-            <img className="logo" alt="Logo" src={require('./Full_Logo.png')} />
+	<div className="back">
+				<div className="backBox">
+					<div className="welcomeToThe">
+					Welcome to the
+					</div>
+					<div className="logo">
+						<img alt="Logo" src={require('./Full_Logo.png')} />
+					</div>
+					<div className="bottomBox">
+						<div>
+							<Route render={({ history}) => (
+								<FlatButton className="noAccountYetGet"
+									label="No account yet? Get setup now >"
+								 onClick={()=>{
+									 history.push('/StepOne');
+								 }}
+							 />
+							)} />
+						</div>
+					</div>
+					<div className="loginBoxPos">
+						<form>
+						{
+									!props.currentUser ?
+							<div>
+								<TextField
+									className="loginBox"
+									hintText='Email'
+									floatingLabelText='Email'
+									label="Email"
+									type="email"
+									onChange={(e)=>{
+										email = e.target.value;
+									}}
+								/>
+								<br></br>
+								<TextField
+									className="loginBox"
+									hintText='Password'
+									floatingLabelText='Password'
+									label="Password"
+									onChange={(e)=>{
+										password = e.target.value;
+									}}
+									type="password"
+								/>
+							</div>
+							:
+							<p></p>
+						}
+							<div >
+								{
+									!props.currentUser ?
+									<FlatButton className="loginBtn"
+										label="Login"
+										onClick={()=>{
+
+											props.loginUser({userEmail:email,userPassword:password});
+											props.getCurrentUser();
+
+										}}
+									/>
+									:
+									<Route render={({ history}) => (
+										<FlatButton className="loginBtn"
+	 									 label="My Account"
+	 									 onClick={()=>{
+	 										 history.push('/settings');
+	 									 }}
+	 								 />
+               		)} />
+
+								}
 
-            <form>
-                {!props.currentUser ? (
-                    <div>
-                        <TextField
-                            className="loginEmail"
-                            hintText="Email"
-                            floatingLabelText="Email"
-                            label="Email"
-                            type="email"
-                            onChange={e => {
-                                email = e.target.value;
-                            }}
-                        />
-                        <TextField
-                            className="loginPass"
-                            hintText="Password"
-                            floatingLabelText="Password"
-                            label="Password"
-                            onChange={e => {
-                                password = e.target.value;
-                            }}
-                            type="password"
-                        />
-                    </div>
-                ) : (
-                    <p />
-                )}
-                <div>
-                    {!props.currentUser ? (
-                        <FlatButton
-                            className="loginBtn"
-                            label="Login"
-                            onClick={() => {
-                                props.loginUser({ userEmail: email, userPassword: password });
-                                props.getCurrentUser();
-                            }}
-                        />
-                    ) : (
-                        <Route
-                            render={({ history }) => (
-                                <FlatButton
-                                    className="loginBtn"
-                                    label="My Account"
-                                    onClick={() => {
-                                        history.push('/settings');
-                                    }}
-                                />
-                            )}
-                        />
-                    )}
-                </div>
-            </form>
-        </div>
-    </div>
-);
+							</div>
+						</form>
+					</div>
+				</div>
+			</div>
+		)
 
-const mapStateToProps = state => ({
-    chats: state.Chat.chats,
-    msgs: state.Chat.msgs,
-    currentUser: state.Account.currentUser,
-    users: state.Account.users
-});
+	const mapStateToProps = state => ({
+	  chats:state.Chat.chats,
+	  msgs:state.Chat.msgs,
+	  currentUser: state.Account.currentUser,
+	  users: state.Account.users,
+	})
 
-const mapDispatchToProps = dispatch =>
-    bindActionCreators(
-        {
-            getUser,
-            getCurrentUser,
-            changeUser,
-            addMsg,
-            getMsgs,
-            registerUser,
-            loginUser,
-            getChats
-        },
-        dispatch
-    );
+	const mapDispatchToProps = dispatch => bindActionCreators({
+	  getUser,
+	  getCurrentUser,
+	  changeUser,
+	  addMsg,
+	  getMsgs,
+	  registerUser,
+	  loginUser,
+	  getChats
+	}, dispatch)
 
-export default connect(mapStateToProps, mapDispatchToProps)(Login);
+	export default connect(mapStateToProps, mapDispatchToProps)(Login);
diff --git a/src/components/login/validate.js b/src/components/login/validate.js
index 8701d41..de4eabc 100644
--- a/src/components/login/validate.js
+++ b/src/components/login/validate.js
@@ -1,13 +1,19 @@
 export default function(values) {
     const errors = {};
-    const requiredFields = ['Email', 'Password'];
+    const requiredFields = [
+      'Email',
+      'Password',
+    ];
     requiredFields.forEach(field => {
-        if (!values[field]) {
-            errors[field] = 'Required';
-        }
+      if (!values[field]) {
+        errors[field] = 'Required';
+      }
     });
-    if (values.email && !/^[A-Z0-9._%+-]+@[A-Z0-9.-]+\.[A-Z]{2,4}$/i.test(values.email)) {
-        errors.email = 'Invalid email address';
+    if (
+      values.email &&
+      !/^[A-Z0-9._%+-]+@[A-Z0-9.-]+\.[A-Z]{2,4}$/i.test(values.email)
+    ) {
+      errors.email = 'Invalid email address';
     }
     return errors;
-}
+  }
diff --git a/src/components/registration/stepOne.js b/src/components/registration/stepOne.js
index a68e494..fb76079 100644
--- a/src/components/registration/stepOne.js
+++ b/src/components/registration/stepOne.js
@@ -1,117 +1,114 @@
 import React from 'react';
 import MuiThemeProvider from 'material-ui/styles/MuiThemeProvider';
 import TextField from 'material-ui/TextField';
-import { Route } from 'react-router-dom';
+import { Route } from 'react-router-dom'
 
 import './reg.css';
 import { white } from 'material-ui/styles/colors';
 import FlatButton from 'material-ui/FlatButton/FlatButton';
 
-import { bindActionCreators } from 'redux';
-import { connect } from 'react-redux';
+import { bindActionCreators } from 'redux'
+import { connect } from 'react-redux'
 
 import {
-    getUser,
-    changeUser,
-    getCurrentUser,
-    registerUser,
-    loginUser
-} from '../../reducers/Account';
+  getUser,
+  changeUser,
+  getCurrentUser,
+  registerUser,
+  loginUser
+} from '../../reducers/Account'
 
-import { addMsg, getMsgs, getChats } from '../../reducers/Chat';
+import {
+  addMsg,
+  getMsgs,
+  getChats
+} from '../../reducers/Chat'
 
 class StepOne extends React.Component {
-    constructor(props) {
-        super(props);
-        this.props = props;
-    }
+  constructor(props) {
+    super(props);
+    this.props = props;
+  }
+
+  render() {
+    return (
+      <div className="pageContainer">
+      <div className="reg-rectangle">
+        <h2 className="step-one">Step One</h2>
+        <h2 className="the-basics">THE BASICS</h2>
+        <MuiThemeProvider>
+          <div className="form-field" >
+            <form>
+              <TextField
+                className="input"
+                type="text"
+                hintText="Enter your Name"
+                floatingLabelText="Your Name"
+                floatingLabelStyle={{ color: white }}
+                onChange={(e)=>{
+										this.username = e.target.value;
+									}}
+              />
+              <br />
+              <TextField
+                className="input"
+                type="email"
+                hintText="Enter your Email"
+                floatingLabelText="Email"
+                floatingLabelStyle={{ color: white }}
+                onChange={(e)=>{
+										this.email = e.target.value;
+									}}
+              />
+              <br />
+              <TextField
+                className="input"
+                type="password"
+                hintText="Enter your Password"
+                floatingLabelText="Password"
+                floatingLabelStyle={{ color: white }}
+                onChange={(e)=>{
+										this.password = e.target.value;
+									}}
+              />
+          </form>
+          </div>
+        </MuiThemeProvider>
+        <div className="nextBox">
+
+        <Route render={({ history }) => (
+          <FlatButton {...this.props}
+            onClick={() => {
+              this.props.registerUser({userName:this.username, userEmail:this.email, userPassword:this.password})
+              this.setState({ logged: false })
+              history.push('/StepTwo')
+            }}
+            className="next-button"
+            label="Next Step" />
+        )} />
+        </div>
+      </div>
+    </div>
+    )
+  }
 
-    render() {
-        return (
-            <div className="pageContainer">
-                <div className="regRectangle">
-                    <h2 className="stepHeading">Step One</h2>
-                    <h2 className="titleHeading">THE BASICS</h2>
-                    <MuiThemeProvider>
-                        <div className="formField">
-                            <form>
-                                <TextField
-                                    className="input"
-                                    type="text"
-                                    floatingLabelText="Your Name"
-                                    floatingLabelStyle={{ color: white }}
-                                    onChange={e => {
-                                        this.username = e.target.value;
-                                    }}
-                                />
-                                <br />
-                                <TextField
-                                    className="input"
-                                    type="email"
-                                    floatingLabelText="Email"
-                                    floatingLabelStyle={{ color: white }}
-                                    onChange={e => {
-                                        this.email = e.target.value;
-                                    }}
-                                />
-                                <br />
-                                <TextField
-                                    className="input"
-                                    type="password"
-                                    floatingLabelText="Password"
-                                    floatingLabelStyle={{ color: white }}
-                                    onChange={e => {
-                                        this.password = e.target.value;
-                                    }}
-                                />
-                            </form>
-                        </div>
-                    </MuiThemeProvider>
-                    <div className="nextBox">
-                        <Route
-                            render={({ history }) => (
-                                <FlatButton
-                                    {...this.props}
-                                    onClick={() => {
-                                        this.props.registerUser({
-                                            userName: this.username,
-                                            userEmail: this.email,
-                                            userPassword: this.password
-                                        });
-                                        this.setState({ logged: false });
-                                        history.push('/StepTwo');
-                                    }}
-                                    className="nextButton"
-                                    label="Next Step"
-                                />
-                            )}
-                        />
-                    </div>
-                </div>
-            </div>
-        );
-    }
 }
 const mapStateToProps = state => ({
-    chats: state.Chat.chats,
-    msgs: state.Chat.msgs,
-    currentUser: state.Account.currentUser,
-    users: state.Account.users
-});
+  chats:state.Chat.chats,
+  msgs:state.Chat.msgs,
+  currentUser: state.Account.currentUser,
+  users: state.Account.users,
+})
 
-const mapDispatchToProps = dispatch =>
-    bindActionCreators(
-        {
-            getUser,
-            getCurrentUser,
-            changeUser,
-            addMsg,
-            getMsgs,
-            registerUser,
-            loginUser,
-            getChats
-        },
-        dispatch
-    );
+const mapDispatchToProps = dispatch => bindActionCreators({
+  getUser,
+  getCurrentUser,
+  changeUser,
+  addMsg,
+  getMsgs,
+  registerUser,
+  loginUser,
+  getChats
+}, dispatch)
 
 export default connect(mapStateToProps, mapDispatchToProps)(StepOne);
diff --git a/src/components/registration/stepThree.js b/src/components/registration/stepThree.js
index 16b1788..fc69190 100644
--- a/src/components/registration/stepThree.js
+++ b/src/components/registration/stepThree.js
@@ -4,71 +4,57 @@ import TextField from 'material-ui/TextField';
 import { white } from 'material-ui/styles/colors';
 import { Route } from 'react-router-dom';
 import FlatButton from 'material-ui/FlatButton/FlatButton';
-import './reg.css';
+import './reg.css'
 
 class StepThree extends React.Component {
-    render() {
-        return (
-            <div className="pageContainer">
-                <div className="regRectangle">
-                    <h2 className="stepHeading">Last Step</h2>
-                    <h2 className="titleHeading">YOUR FIRST CHAT</h2>
 
-                    <MuiThemeProvider>
-                        <div className="formField">
-                            <form>
-                                <br />
-                                <br />
-                                <br />
-                                <br />
-                                <TextField
-                                    className="input"
-                                    floatingLabelText="Friends' Email"
-                                    floatingLabelStyle={{ color: white }}
-                                />
-                                <br />
-                                <br />
-                                <br />
-                                <br />
-                            </form>
-                        </div>
-                    </MuiThemeProvider>
-                    <div className="nextBox">
-                        <Route
-                            render={({ history }) => (
-                                <FlatButton
-                                    {...this.props}
-                                    onClick={() => {
-                                        this.setState({ logged: false });
-                                        history.push('/Login');
-                                    }}
-                                    className="nextButton"
-                                    label="Submit"
-                                />
-                            )}
-                        />
-                    </div>
-                    <div className="skip">
-                        <Route
-                            render={({ history }) => (
-                                <p
-                                    {...this.props}
-                                    onClick={() => {
-                                        this.setState({ logged: false });
-                                        history.push('/Login');
-                                    }}
-                                    className="skipForNow "
-                                    label="Next Step"
-                                >
-                                    Skip for now
-                                </p>
-                            )}
-                        />
-                    </div>
-                </div>
+  render() {
+    return (
+      <div className="pageContainer">
+        <div className="reg-rectangle">
+          <h2 className="step-one">Last Step</h2>
+          <h2 className="the-basics">YOUR FIRST CHAT</h2>
+
+          <MuiThemeProvider>
+            <div className="form-field" >
+              <form>
+                <br/><br/><br/><br/>
+                <TextField
+                  className="input"
+                  hintText="Fiends' Email"
+                  floatingLabelText="Friends' Email"
+                  floatingLabelStyle={{ color: white }}
+                />
+                <br /><br/><br/><br/>
+              </form>
             </div>
-        );
-    }
+
+          </MuiThemeProvider>
+          <div className="nextBox">
+          <Route render={({ history }) => (
+                        <FlatButton {...this.props} onClick={() => {
+                            this.setState({ logged: false })
+                            history.push('/Login')
+                        }}
+                            className="next-button"
+                            label="Submit" />
+                    )} />
+
+          </div>
+          <div className="skip">
+          <Route render={({ history }) => (
+            <p {...this.props} onClick={() => {
+                this.setState({ logged: false })
+                history.push('/Login')
+            }}
+            className="skip-for-now "
+                label="Next Step" >Skip for now</p>
+        )} />
+          </div>
+        </div>
+      </div>
+    );
+  }
 }
 
-export default StepThree;
+export default StepThree
diff --git a/src/components/registration/stepTwo.js b/src/components/registration/stepTwo.js
index 167fa34..2cfd3af 100644
--- a/src/components/registration/stepTwo.js
+++ b/src/components/registration/stepTwo.js
@@ -4,18 +4,23 @@ import { Route } from 'react-router-dom';
 import FlatButton from 'material-ui/FlatButton/FlatButton';
 import './reg.css';
 
-import { bindActionCreators } from 'redux';
-import { connect } from 'react-redux';
+
+import { bindActionCreators } from 'redux'
+import { connect } from 'react-redux'
 
 import {
-    getUser,
-    changeUser,
-    getCurrentUser,
-    registerUser,
-    loginUser
-} from '../../reducers/Account';
+  getUser,
+  changeUser,
+  getCurrentUser,
+  registerUser,
+  loginUser
+} from '../../reducers/Account'
 
-import { addMsg, getMsgs, getChats } from '../../reducers/Chat';
+import {
+  addMsg,
+  getMsgs,
+  getChats
+} from '../../reducers/Chat'
 
 class StepTwo extends React.Component {
     constructor(props) {
@@ -23,7 +28,7 @@ class StepTwo extends React.Component {
         this.props = props;
     }
 
-    changeImg = e => {
+    changeImg = (e) => {
         console.log(e.target);
         console.log(e.target.files[0]);
 
@@ -33,86 +38,77 @@ class StepTwo extends React.Component {
                 this.setState({ profilephoto: event.target.result });
             };
             reader.readAsDataURL(e.target.files[0]);
+
         }
 
         this.setState({ hasimg: true });
-    };
+    }
     state = {
         profilephoto: '',
         hasimg: false
     };
 
-    saveImg = () => {
-        this.props.changeUser({ userImg: this.state.profilephoto });
+    saveImg = () =>{
+        this.props.changeUser({userImg:this.state.profilephoto});
 
         this.props.getCurrentUser();
         this.forceUpdate();
-    };
+    }
 
     render() {
         return (
             <div className="pageContainer">
-                <div className="regRectangle">
-                    <h2 className="stepHeading">Step Two</h2>
-                    <h2 className="titleHeading">PROFILE PICTURE</h2>
-                    <MuiThemeProvider>
-                        <div className="proPicPlaceholder">
-                            {!this.state.hasimg ? (
-                                <div className="uploadCircle">
-                                    <div className="plusLogo">
-                                        <div className="plusHorizontal" />
-                                        <div className="plusVertical" />
-                                    </div>
-                                    <input
-                                        type="file"
-                                        onChange={e => {
-                                            this.changeImg(e);
-                                        }}
-                                        style={inputimg}
-                                    />
+            <div className="reg-rectangle">
+                <h2 className="step-one">Step Two</h2>
+                <h2 className="the-basics">PROFILE PICTURE</h2>
+                <MuiThemeProvider>
+                <div className="pro-pic-placeholder" >
+                        {!this.state.hasimg ?
+                            <div className="upload-circle">
+                                <div className="plus-logo">
+                                    <div className="plus-horizontal" />
+                                    <div className="plus-vertical" />
                                 </div>
-                            ) : (
-                                <img
-                                    src={this.state.profilephoto}
-                                    className="proPicJpg"
-                                    alt="Profile"
-                                />
-                            )}
-                        </div>
-                    </MuiThemeProvider>
-                    <div className="nextBox">
-                        <Route
-                            render={({ history }) => (
-                                <FlatButton
-                                    {...this.props}
-                                    onClick={() => {
-                                        this.saveImg();
-                                        history.push('/StepThree');
+                                <input
+                                    type="file"
+                                    onChange={e => {
+                                        this.changeImg(e);
                                     }}
-                                    className="nextButton"
-                                    label="Next Step"
+                                    style={inputimg}
                                 />
-                            )}
-                        />
-                    </div>
-                    <div className="skip2">
-                        <Route
-                            render={({ history }) => (
-                                <p
-                                    {...this.props}
-                                    onClick={() => {
-                                        this.setState({ logged: false });
-                                        history.push('/StepThree');
-                                    }}
-                                    className="skipForNow "
-                                    label="Next Step"
-                                >
-                                    Skip for now
-                                </p>
-                            )}
-                        />
+                            </div>
+                            :
+                            <img
+                                src={this.state.profilephoto}
+                                className="pro-pic-jpg"
+                                alt="Profile"
+                            />
+                        }
+
                     </div>
+                </MuiThemeProvider>
+                <div className="nextBox">
+                    <Route render={({ history }) => (
+                        <FlatButton {...this.props} onClick={() => {
+                            this.saveImg()
+                            history.push('/StepThree')
+                        }}
+                            className="next-button-2"
+                            label="Next Step" />
+                    )} />
                 </div>
+                <div className="skip-2">
+                <Route render={({ history }) => (
+                        <p {...this.props} onClick={() => {
+                            this.setState({ logged: false })
+                            history.push('/StepThree')
+                        }}
+                        className="skip-for-now "
+                            label="Next Step" >Skip for now</p>
+                    )} />
+
+                </div>
+            </div>
             </div>
         );
     }
@@ -127,25 +123,21 @@ const inputimg = {
     width: '100%'
 };
 const mapStateToProps = state => ({
-    chats: state.Chat.chats,
-    msgs: state.Chat.msgs,
+    chats:state.Chat.chats,
+    msgs:state.Chat.msgs,
     currentUser: state.Account.currentUser,
-    users: state.Account.users
-});
-
-const mapDispatchToProps = dispatch =>
-    bindActionCreators(
-        {
-            getUser,
-            getCurrentUser,
-            changeUser,
-            addMsg,
-            getMsgs,
-            registerUser,
-            loginUser,
-            getChats
-        },
-        dispatch
-    );
-
-export default connect(mapStateToProps, mapDispatchToProps)(StepTwo);
+    users: state.Account.users,
+  })
+
+  const mapDispatchToProps = dispatch => bindActionCreators({
+    getUser,
+    getCurrentUser,
+    changeUser,
+    addMsg,
+    getMsgs,
+    registerUser,
+    loginUser,
+    getChats
+  }, dispatch)
+
+  export default connect(mapStateToProps, mapDispatchToProps)(StepTwo);
diff --git a/src/reducers/Account.js b/src/reducers/Account.js
index 99b17d7..11e3212 100644
--- a/src/reducers/Account.js
+++ b/src/reducers/Account.js
@@ -12,11 +12,9 @@ export const CHANGE_SELECTED_CHAT = 'Account/CHANGE_SELECTED_CHAT';
 export const CHANGE_RECIEVER = 'Account/CHANGE_RECIEVER';
 export const ALL_USERS = 'Account/ALL_USERS';
 
+const link = 'http://192.168.0.20:54980';
+
 const initialState = {
-    api: {
-        host: 'http://192.168.0.20',
-        port: 54980
-    },
     currentUserChats: [],
     filteredChats: [],
     currentUser: null,
@@ -125,38 +123,8 @@ export default (state = initialState, action) => {
             let msgs = action.allMsgs;
             let userChats = [];
 
-            for (let msg of msgs) {
-                if (
-                    msg.recieverID === state.currentUser.userID ||
-                    msg.senderId === state.currentUser.userID
-                ) {
-                    for (let user of state.users) {
-                        if (msg.senderId === user.userID || msg.receiverId === user.userID) {
-                            if (userChats.length > 0) {
-                                let duplicatefound = false;
-                                for (let userDet of userChats) {
-                                    if (userDet.userID === user.userID) {
-                                        userDet = user;
-                                        userDet.latestMessage = msg.text;
-                                        userDet.selected = false;
-                                        duplicatefound = true;
-                                    }
-                                }
-                                if (!duplicatefound) {
-                                    user.latestMessage = msg.text;
-                                    user.selected = false;
-                                    userChats.push(user);
-                                }
-                            } else {
-                                user.latestMessage = msg.text;
-                                user.selected = false;
-                                userChats.push(user);
-                            }
-                        }
-                    }
-                }
-            }
 
+            alert("Current user chats " + )
             console.log(userChats);
             return {
                 ...state,
@@ -192,7 +160,7 @@ export default (state = initialState, action) => {
 export const getUser = userID => {
     return dispatch => {
         axios
-            .get(initialState.api.host + ':' + initialState.api.port + 'api/Users/' + userID)
+            .get(link + 'api/Users/' + userID)
             .then(function(response) {
                 dispatch({ type: USER_ACCOUNT, user: response.data });
             });
@@ -221,7 +189,7 @@ export const getUsers = () => {
     return dispatch => {
         alert('About to');
         axios
-            .get(initialState.api.host + ':' + initialState.api.port + '/api/Users/GetAllUsers')
+            .get(link + '/api/Users/GetAllUsers')
             .then(function(response) {
                 dispatch({ type: ALL_USERS, users: response.data });
             })
@@ -229,12 +197,42 @@ export const getUsers = () => {
     };
 };
 
-export const getUserChats = allMsgs => {
+export const getUserChats = (userID) => {
     return dispatch => {
         axios
-            .get(initialState.api.host + ':' + initialState.api.port + '/api/chats')
+            .get(link + '/api/Chats/GetBySender/' + userID)
             .then(function(response) {
-                dispatch({ type: CURRENT_USER_CHATS, allMsgs: response.data });
+
+
+              for (let msg of msgs) {
+              {
+                  for (let user of state.users) {
+                      if (msg.senderId === user.userID || msg.receiverId === user.userID) {
+                          if (userChats.length > 0) {
+                              let duplicatefound = false;
+                              for (let userDet of userChats) {
+                                  if (userDet.userID === user.userID) {
+                                      userDet = user;
+                                      userDet.latestMessage = msg.text;
+                                      userDet.selected = false;
+                                      duplicatefound = true;
+                                  }
+                              }
+                              if (!duplicatefound) {
+                                  user.latestMessage = msg.text;
+                                  user.selected = false;
+                                  userChats.push(user);
+                              }
+                          } else {
+                              user.latestMessage = msg.text;
+                              user.selected = false;
+                              userChats.push(user);
+                          }
+                      }
+                  }
+              }
+
+              dispatch({ type: CURRENT_USER_CHATS, allChats: response.data });
             })
             .catch(function(error) {});
     };
diff --git a/src/reducers/Chat.js b/src/reducers/Chat.js
index f7dcfc4..1eae102 100644
--- a/src/reducers/Chat.js
+++ b/src/reducers/Chat.js
@@ -5,11 +5,9 @@ export const GET_CHATS = 'Chat/GET_CHATS';
 export const GET_MSGS = 'Chat/GET_MSGS';
 export const ADD_MSG = 'Chat/ADD_MSG';
 
+const link = 'http://192.168.0.20:54980';
+
 const initialState = {
-    api: {
-        host: 'http://192.168.0.20',
-        port: 54980
-    },
     msgs: [{}],
     allMsgs: [{}],
     currentChat: [],
@@ -53,10 +51,7 @@ export const getChats = userID => {
     return dispatch => {
         var msgs = [];
         axios
-            .get(
-                initialState.api.host +
-                    ':' +
-                    initialState.api.port +
+            .get(link +
                     '/api/chats/getchatsforuser/' +
                     userID
             )
@@ -75,7 +70,7 @@ export const getMsgs = (senderId, receiverId) => {
     return dispatch => {
         var msgs = [];
         axios
-            .get(initialState.api.host + ':' + initialState.api.port + '/api/chats')
+            .get(link + '/api/chats')
             .then(function(response) {
                 dispatch({
                     type: GET_MSGS,
@@ -100,7 +95,7 @@ export const addMsg = (msg, senderId, receiverId) => {
         };
 
         axios
-            .post(initialState.api.host + ':' + initialState.api.port + '/api/chats', newMsg)
+            .post(link + '/api/chats', newMsg)
             .then(function(response) {
                 console.log(response);
                 alert('sent');

From efa344bab7f655c9b7ff0fa24cb61b5bc35733a0 Mon Sep 17 00:00:00 2001
From: Lavhe <mulavhe@gmail.com>
Date: Fri, 12 Jan 2018 15:37:10 +0200
Subject: [PATCH 7/8] Chat functionality is ohk

---
 src/components/accountScreen/accountScreen.js |  62 +++--
 src/components/headerNav/headerNav.js         |   3 +
 src/components/login/loginIndex.js            | 221 +++++++++---------
 src/components/login/validate.js              |  20 +-
 src/components/registration/stepOne.js        | 193 +++++++--------
 src/components/registration/stepThree.js      | 110 +++++----
 src/components/registration/stepTwo.js        | 174 +++++++-------
 src/reducers/Account.js                       | 142 ++++++-----
 src/reducers/Chat.js                          |  54 +++--
 9 files changed, 529 insertions(+), 450 deletions(-)

diff --git a/src/components/accountScreen/accountScreen.js b/src/components/accountScreen/accountScreen.js
index 6ff3e5a..55bc388 100644
--- a/src/components/accountScreen/accountScreen.js
+++ b/src/components/accountScreen/accountScreen.js
@@ -21,7 +21,7 @@ import {
     changeReciever
 } from '../../reducers/Account';
 
-import { addMsg, getMsgs, getChats } from '../../reducers/Chat';
+import { addMsg, getMsgs, getChats, updateMsgs } from '../../reducers/Chat';
 
 const ChatBubbleRightStyle = {
     backgroundColor: '#007D80',
@@ -44,14 +44,15 @@ const getShort = str => {
 };
 
 const getShortTime = str => {
-    try {
-        var fullTime = str.split('T')[1];
-        var hour = fullTime.split(':')[0];
-        var minute = fullTime.split(':')[1];
-        return hour + ':' + minute;
-    } catch (ex) {
-        return '-----';
+    try{
+      var fullTime = str.split('T')[1];
+      var hour = fullTime.split(':')[0];
+      var minute = fullTime.split(':')[1];
+      return hour + ":" + minute;
+    }catch(ex){
+      return "-----";
     }
+
 };
 
 const cardHeaderStyle = {
@@ -155,17 +156,19 @@ const NewText = function(props) {
                     hintText="Insert Text Message Here"
                     onKeyDown={e => {
                         if (e.key === 'Enter' && e.target.value.length > 0) {
+
                             props.addMsg(
                                 e.target.value,
                                 props.currentUser.userID,
                                 props.receiver.userID
                             );
-                            props.getUserChats();
+
+                            props.getUserChats(props.currentUser.userID);
 
                             e.target.value = '';
-                            setTimeout(function() {
-                                var objDiv = document.getElementById('theChat');
-                                objDiv.scrollTop = objDiv.scrollHeight;
+                            setTimeout(function () {
+                              var objDiv = document.getElementById("theChat");
+                              objDiv.scrollTop =  objDiv.scrollHeight;
                             }, 1);
                         }
                     }}
@@ -198,18 +201,28 @@ const MessageTimeRight = function(props) {
 class AccountScreen extends Component {
     constructor(props) {
         super(props);
-        try {
+        try{
             props.getCurrentUser();
             var id = props.currentUser.userID;
-        } catch (exc) {
-            window.location.href = '/';
-        }
+            props.getUsers();
+            props.getUserChats(id);
+
+            setInterval(()=>{
+              try{
+                props.getMsgs(props.currentUser.userID, props.receiver.userID);
+                props.updateMsgs(props.currentUser.userID,props.receiver.userID);
+              }catch(exc){
 
-        props.getUsers();
-        props.getMsgs(props.currentUser.userID, props.receiver.userID);
+              }
+            },500)
+        }
+        catch(exc){
+                window.location.href = '/';
+        }
 
         this.filterList = this.filterList.bind(this);
         //this.state = { initialItems: initialItems, items: initialItems };
+
     }
 
     componentWillReceiveProps(newProps) {
@@ -228,6 +241,8 @@ class AccountScreen extends Component {
         let userID = chat.userID;
         let tempChats = this.props.filteredChats;
 
+        console.log(userID + " is thier ID")
+
         for (let i = 0; i < tempChats.length; i++) {
             tempChats[i].selected = false;
         }
@@ -248,11 +263,7 @@ class AccountScreen extends Component {
     render() {
         return (
             <div>
-                <HeaderNav
-                    pic={this.props.currentUser.userImg}
-                    surname={this.props.currentUser.userSurname}
-                    name={this.props.currentUser.userName}
-                />
+                <HeaderNav pic={ this.props.currentUser.userImg } surname={ this.props.currentUser.userSurname  } name={ this.props.currentUser.userName } />
                 <div className="leftPanelContainer">
                     <div className="searchContainer">
                         <SearchBar
@@ -280,7 +291,7 @@ class AccountScreen extends Component {
                 </div>
 
                 <div id="theChat" className="mainBubbleContainer">
-                    {this.props.msgs.map(chat => {
+                  {this.props.msgs.map(chat => {
                         if (
                             chat.senderId === this.props.currentUser.userID &&
                             chat.receiverId === this.props.receiver.userID
@@ -341,7 +352,8 @@ const mapDispatchToProps = dispatch =>
             getUserChats,
             filterUserChats,
             changeSelectedChat,
-            changeReciever
+            changeReciever,
+            updateMsgs
         },
         dispatch
     );
diff --git a/src/components/headerNav/headerNav.js b/src/components/headerNav/headerNav.js
index aa07d22..7691799 100644
--- a/src/components/headerNav/headerNav.js
+++ b/src/components/headerNav/headerNav.js
@@ -21,6 +21,7 @@ import TextField from 'material-ui/TextField';
 import { Card, CardActions, CardHeader, CardMedia, CardTitle, CardText } from 'material-ui/Card';
 
 import {
+    getUsers,
     getUser,
     changeUser,
     getCurrentUser,
@@ -35,6 +36,7 @@ class HeaderNav extends Component {
     constructor(props) {
         super(props);
         this.props = props;
+        props.getUsers();
         try {
             props.getCurrentUser();
         } catch (exc) {
@@ -236,6 +238,7 @@ const mapStateToProps = state => {
 const mapDispatchToProps = dispatch =>
     bindActionCreators(
         {
+            getUsers,
             getUser,
             getCurrentUser,
             changeUser,
diff --git a/src/components/login/loginIndex.js b/src/components/login/loginIndex.js
index 2a7626c..7aaef0d 100644
--- a/src/components/login/loginIndex.js
+++ b/src/components/login/loginIndex.js
@@ -1,129 +1,124 @@
 import React from 'react';
 
-import {Route} from 'react-router-dom'
+import { Route } from 'react-router-dom';
+
 import TextField from 'material-ui/TextField';
 import FlatButton from 'material-ui/FlatButton';
 import './loginIndex.css';
 
-import { bindActionCreators } from 'redux'
-import { connect } from 'react-redux'
-
-import {
-  getUser,
-  changeUser,
-  getCurrentUser,
-  registerUser,
-  loginUser
-} from '../../reducers/Account'
+import { bindActionCreators } from 'redux';
+import { connect } from 'react-redux';
 
 import {
-  addMsg,
-  getMsgs,
-  getChats
-} from '../../reducers/Chat'
+    getUser,
+    changeUser,
+    getCurrentUser,
+    registerUser,
+    loginUser
+} from '../../reducers/Account';
 
+import { addMsg, getMsgs, getChats } from '../../reducers/Chat';
 
-	let email =  ""
-	let password = ""
+let email = '';
+let password = '';
 
 const Login = props => (
-	<div className="back">
-				<div className="backBox">
-					<div className="welcomeToThe">
-					Welcome to the
-					</div>
-					<div className="logo">
-						<img alt="Logo" src={require('./Full_Logo.png')} />
-					</div>
-					<div className="bottomBox">
-						<div>
-							<Route render={({ history}) => (
-								<FlatButton className="noAccountYetGet"
-									label="No account yet? Get setup now >"
-								 onClick={()=>{
-									 history.push('/StepOne');
-								 }}
-							 />
-							)} />
-						</div>
-					</div>
-					<div className="loginBoxPos">
-						<form>
-						{
-									!props.currentUser ?
-							<div>
-								<TextField
-									className="loginBox"
-									hintText='Email'
-									floatingLabelText='Email'
-									label="Email"
-									type="email"
-									onChange={(e)=>{
-										email = e.target.value;
-									}}
-								/>
-								<br></br>
-								<TextField
-									className="loginBox"
-									hintText='Password'
-									floatingLabelText='Password'
-									label="Password"
-									onChange={(e)=>{
-										password = e.target.value;
-									}}
-									type="password"
-								/>
-							</div>
-							:
-							<p></p>
-						}
-							<div >
-								{
-									!props.currentUser ?
-									<FlatButton className="loginBtn"
-										label="Login"
-										onClick={()=>{
-
-											props.loginUser({userEmail:email,userPassword:password});
-											props.getCurrentUser();
-
-										}}
-									/>
-									:
-									<Route render={({ history}) => (
-										<FlatButton className="loginBtn"
-	 									 label="My Account"
-	 									 onClick={()=>{
-	 										 history.push('/settings');
-	 									 }}
-	 								 />
-               		)} />
-
-								}
+    <div className="back">
+        <div className="backBox">
+            <div className="bottomBox">
+                <div>
+                    <Route
+                        render={({ history }) => (
+                            <FlatButton
+                                className="noAccountYetGet"
+                                label="No account yet? Get setup now >"
+                                onClick={() => {
+                                    history.push('/StepOne');
+                                }}
+                            />
+                        )}
+                    />
+                </div>
+            </div>
+            <div className="welcomeToThe">Welcome to the</div>
+            <img className="logo" alt="Logo" src={require('./Full_Logo.png')} />
 
-							</div>
-						</form>
-					</div>
-				</div>
-			</div>
-		)
+            <form>
+                {!props.currentUser ? (
+                    <div>
+                        <TextField
+                            className="loginEmail"
+                            hintText="Email"
+                            floatingLabelText="Email"
+                            label="Email"
+                            type="email"
+                            onChange={e => {
+                                email = e.target.value;
+                            }}
+                        />
+                        <TextField
+                            className="loginPass"
+                            hintText="Password"
+                            floatingLabelText="Password"
+                            label="Password"
+                            onChange={e => {
+                                password = e.target.value;
+                            }}
+                            type="password"
+                        />
+                    </div>
+                ) : (
+                    <p />
+                )}
+                <div>
+                    {!props.currentUser ? (
+                        <FlatButton
+                            className="loginBtn"
+                            label="Login"
+                            onClick={() => {
+                                props.loginUser({ userEmail: email, userPassword: password });
+                                props.getCurrentUser();
+                            }}
+                        />
+                    ) : (
+                        <Route
+                            render={({ history }) => (
+                                <FlatButton
+                                    className="loginBtn"
+                                    label="My Account"
+                                    onClick={() => {
+                                        history.push('/settings');
+                                    }}
+                                />
+                            )}
+                        />
+                    )}
+                </div>
+            </form>
+        </div>
+    </div>
+);
 
-	const mapStateToProps = state => ({
-	  chats:state.Chat.chats,
-	  msgs:state.Chat.msgs,
-	  currentUser: state.Account.currentUser,
-	  users: state.Account.users,
-	})
+const mapStateToProps = state => ({
+    chats: state.Chat.chats,
+    msgs: state.Chat.msgs,
+    currentUser: state.Account.currentUser,
+    users: state.Account.users
+});
 
-	const mapDispatchToProps = dispatch => bindActionCreators({
-	  getUser,
-	  getCurrentUser,
-	  changeUser,
-	  addMsg,
-	  getMsgs,
-	  registerUser,
-	  loginUser,
-	  getChats
-	}, dispatch)
+const mapDispatchToProps = dispatch =>
+    bindActionCreators(
+        {
+            getUser,
+            getCurrentUser,
+            changeUser,
+            addMsg,
+            getMsgs,
+            registerUser,
+            loginUser,
+            getChats
+        },
+        dispatch
+    );
 
-	export default connect(mapStateToProps, mapDispatchToProps)(Login);
+export default connect(mapStateToProps, mapDispatchToProps)(Login);
diff --git a/src/components/login/validate.js b/src/components/login/validate.js
index de4eabc..8701d41 100644
--- a/src/components/login/validate.js
+++ b/src/components/login/validate.js
@@ -1,19 +1,13 @@
 export default function(values) {
     const errors = {};
-    const requiredFields = [
-      'Email',
-      'Password',
-    ];
+    const requiredFields = ['Email', 'Password'];
     requiredFields.forEach(field => {
-      if (!values[field]) {
-        errors[field] = 'Required';
-      }
+        if (!values[field]) {
+            errors[field] = 'Required';
+        }
     });
-    if (
-      values.email &&
-      !/^[A-Z0-9._%+-]+@[A-Z0-9.-]+\.[A-Z]{2,4}$/i.test(values.email)
-    ) {
-      errors.email = 'Invalid email address';
+    if (values.email && !/^[A-Z0-9._%+-]+@[A-Z0-9.-]+\.[A-Z]{2,4}$/i.test(values.email)) {
+        errors.email = 'Invalid email address';
     }
     return errors;
-  }
+}
diff --git a/src/components/registration/stepOne.js b/src/components/registration/stepOne.js
index fb76079..a68e494 100644
--- a/src/components/registration/stepOne.js
+++ b/src/components/registration/stepOne.js
@@ -1,114 +1,117 @@
 import React from 'react';
 import MuiThemeProvider from 'material-ui/styles/MuiThemeProvider';
 import TextField from 'material-ui/TextField';
-import { Route } from 'react-router-dom'
+import { Route } from 'react-router-dom';
 
 import './reg.css';
 import { white } from 'material-ui/styles/colors';
 import FlatButton from 'material-ui/FlatButton/FlatButton';
 
-import { bindActionCreators } from 'redux'
-import { connect } from 'react-redux'
+import { bindActionCreators } from 'redux';
+import { connect } from 'react-redux';
 
 import {
-  getUser,
-  changeUser,
-  getCurrentUser,
-  registerUser,
-  loginUser
-} from '../../reducers/Account'
+    getUser,
+    changeUser,
+    getCurrentUser,
+    registerUser,
+    loginUser
+} from '../../reducers/Account';
 
-import {
-  addMsg,
-  getMsgs,
-  getChats
-} from '../../reducers/Chat'
+import { addMsg, getMsgs, getChats } from '../../reducers/Chat';
 
 class StepOne extends React.Component {
-  constructor(props) {
-    super(props);
-    this.props = props;
-  }
-
-  render() {
-    return (
-      <div className="pageContainer">
-      <div className="reg-rectangle">
-        <h2 className="step-one">Step One</h2>
-        <h2 className="the-basics">THE BASICS</h2>
-        <MuiThemeProvider>
-          <div className="form-field" >
-            <form>
-              <TextField
-                className="input"
-                type="text"
-                hintText="Enter your Name"
-                floatingLabelText="Your Name"
-                floatingLabelStyle={{ color: white }}
-                onChange={(e)=>{
-										this.username = e.target.value;
-									}}
-              />
-              <br />
-              <TextField
-                className="input"
-                type="email"
-                hintText="Enter your Email"
-                floatingLabelText="Email"
-                floatingLabelStyle={{ color: white }}
-                onChange={(e)=>{
-										this.email = e.target.value;
-									}}
-              />
-              <br />
-              <TextField
-                className="input"
-                type="password"
-                hintText="Enter your Password"
-                floatingLabelText="Password"
-                floatingLabelStyle={{ color: white }}
-                onChange={(e)=>{
-										this.password = e.target.value;
-									}}
-              />
-          </form>
-          </div>
-        </MuiThemeProvider>
-        <div className="nextBox">
-
-        <Route render={({ history }) => (
-          <FlatButton {...this.props}
-            onClick={() => {
-              this.props.registerUser({userName:this.username, userEmail:this.email, userPassword:this.password})
-              this.setState({ logged: false })
-              history.push('/StepTwo')
-            }}
-            className="next-button"
-            label="Next Step" />
-        )} />
-        </div>
-      </div>
-    </div>
-    )
-  }
+    constructor(props) {
+        super(props);
+        this.props = props;
+    }
 
+    render() {
+        return (
+            <div className="pageContainer">
+                <div className="regRectangle">
+                    <h2 className="stepHeading">Step One</h2>
+                    <h2 className="titleHeading">THE BASICS</h2>
+                    <MuiThemeProvider>
+                        <div className="formField">
+                            <form>
+                                <TextField
+                                    className="input"
+                                    type="text"
+                                    floatingLabelText="Your Name"
+                                    floatingLabelStyle={{ color: white }}
+                                    onChange={e => {
+                                        this.username = e.target.value;
+                                    }}
+                                />
+                                <br />
+                                <TextField
+                                    className="input"
+                                    type="email"
+                                    floatingLabelText="Email"
+                                    floatingLabelStyle={{ color: white }}
+                                    onChange={e => {
+                                        this.email = e.target.value;
+                                    }}
+                                />
+                                <br />
+                                <TextField
+                                    className="input"
+                                    type="password"
+                                    floatingLabelText="Password"
+                                    floatingLabelStyle={{ color: white }}
+                                    onChange={e => {
+                                        this.password = e.target.value;
+                                    }}
+                                />
+                            </form>
+                        </div>
+                    </MuiThemeProvider>
+                    <div className="nextBox">
+                        <Route
+                            render={({ history }) => (
+                                <FlatButton
+                                    {...this.props}
+                                    onClick={() => {
+                                        this.props.registerUser({
+                                            userName: this.username,
+                                            userEmail: this.email,
+                                            userPassword: this.password
+                                        });
+                                        this.setState({ logged: false });
+                                        history.push('/StepTwo');
+                                    }}
+                                    className="nextButton"
+                                    label="Next Step"
+                                />
+                            )}
+                        />
+                    </div>
+                </div>
+            </div>
+        );
+    }
 }
 const mapStateToProps = state => ({
-  chats:state.Chat.chats,
-  msgs:state.Chat.msgs,
-  currentUser: state.Account.currentUser,
-  users: state.Account.users,
-})
+    chats: state.Chat.chats,
+    msgs: state.Chat.msgs,
+    currentUser: state.Account.currentUser,
+    users: state.Account.users
+});
 
-const mapDispatchToProps = dispatch => bindActionCreators({
-  getUser,
-  getCurrentUser,
-  changeUser,
-  addMsg,
-  getMsgs,
-  registerUser,
-  loginUser,
-  getChats
-}, dispatch)
+const mapDispatchToProps = dispatch =>
+    bindActionCreators(
+        {
+            getUser,
+            getCurrentUser,
+            changeUser,
+            addMsg,
+            getMsgs,
+            registerUser,
+            loginUser,
+            getChats
+        },
+        dispatch
+    );
 
 export default connect(mapStateToProps, mapDispatchToProps)(StepOne);
diff --git a/src/components/registration/stepThree.js b/src/components/registration/stepThree.js
index fc69190..16b1788 100644
--- a/src/components/registration/stepThree.js
+++ b/src/components/registration/stepThree.js
@@ -4,57 +4,71 @@ import TextField from 'material-ui/TextField';
 import { white } from 'material-ui/styles/colors';
 import { Route } from 'react-router-dom';
 import FlatButton from 'material-ui/FlatButton/FlatButton';
-import './reg.css'
+import './reg.css';
 
 class StepThree extends React.Component {
+    render() {
+        return (
+            <div className="pageContainer">
+                <div className="regRectangle">
+                    <h2 className="stepHeading">Last Step</h2>
+                    <h2 className="titleHeading">YOUR FIRST CHAT</h2>
 
-  render() {
-    return (
-      <div className="pageContainer">
-        <div className="reg-rectangle">
-          <h2 className="step-one">Last Step</h2>
-          <h2 className="the-basics">YOUR FIRST CHAT</h2>
-
-          <MuiThemeProvider>
-            <div className="form-field" >
-              <form>
-                <br/><br/><br/><br/>
-                <TextField
-                  className="input"
-                  hintText="Fiends' Email"
-                  floatingLabelText="Friends' Email"
-                  floatingLabelStyle={{ color: white }}
-                />
-                <br /><br/><br/><br/>
-              </form>
+                    <MuiThemeProvider>
+                        <div className="formField">
+                            <form>
+                                <br />
+                                <br />
+                                <br />
+                                <br />
+                                <TextField
+                                    className="input"
+                                    floatingLabelText="Friends' Email"
+                                    floatingLabelStyle={{ color: white }}
+                                />
+                                <br />
+                                <br />
+                                <br />
+                                <br />
+                            </form>
+                        </div>
+                    </MuiThemeProvider>
+                    <div className="nextBox">
+                        <Route
+                            render={({ history }) => (
+                                <FlatButton
+                                    {...this.props}
+                                    onClick={() => {
+                                        this.setState({ logged: false });
+                                        history.push('/Login');
+                                    }}
+                                    className="nextButton"
+                                    label="Submit"
+                                />
+                            )}
+                        />
+                    </div>
+                    <div className="skip">
+                        <Route
+                            render={({ history }) => (
+                                <p
+                                    {...this.props}
+                                    onClick={() => {
+                                        this.setState({ logged: false });
+                                        history.push('/Login');
+                                    }}
+                                    className="skipForNow "
+                                    label="Next Step"
+                                >
+                                    Skip for now
+                                </p>
+                            )}
+                        />
+                    </div>
+                </div>
             </div>
-
-          </MuiThemeProvider>
-          <div className="nextBox">
-          <Route render={({ history }) => (
-                        <FlatButton {...this.props} onClick={() => {
-                            this.setState({ logged: false })
-                            history.push('/Login')
-                        }}
-                            className="next-button"
-                            label="Submit" />
-                    )} />
-
-          </div>
-          <div className="skip">
-          <Route render={({ history }) => (
-            <p {...this.props} onClick={() => {
-                this.setState({ logged: false })
-                history.push('/Login')
-            }}
-            className="skip-for-now "
-                label="Next Step" >Skip for now</p>
-        )} />
-          </div>
-        </div>
-      </div>
-    );
-  }
+        );
+    }
 }
 
-export default StepThree
+export default StepThree;
diff --git a/src/components/registration/stepTwo.js b/src/components/registration/stepTwo.js
index 2cfd3af..167fa34 100644
--- a/src/components/registration/stepTwo.js
+++ b/src/components/registration/stepTwo.js
@@ -4,23 +4,18 @@ import { Route } from 'react-router-dom';
 import FlatButton from 'material-ui/FlatButton/FlatButton';
 import './reg.css';
 
-
-import { bindActionCreators } from 'redux'
-import { connect } from 'react-redux'
+import { bindActionCreators } from 'redux';
+import { connect } from 'react-redux';
 
 import {
-  getUser,
-  changeUser,
-  getCurrentUser,
-  registerUser,
-  loginUser
-} from '../../reducers/Account'
+    getUser,
+    changeUser,
+    getCurrentUser,
+    registerUser,
+    loginUser
+} from '../../reducers/Account';
 
-import {
-  addMsg,
-  getMsgs,
-  getChats
-} from '../../reducers/Chat'
+import { addMsg, getMsgs, getChats } from '../../reducers/Chat';
 
 class StepTwo extends React.Component {
     constructor(props) {
@@ -28,7 +23,7 @@ class StepTwo extends React.Component {
         this.props = props;
     }
 
-    changeImg = (e) => {
+    changeImg = e => {
         console.log(e.target);
         console.log(e.target.files[0]);
 
@@ -38,78 +33,87 @@ class StepTwo extends React.Component {
                 this.setState({ profilephoto: event.target.result });
             };
             reader.readAsDataURL(e.target.files[0]);
-
         }
 
         this.setState({ hasimg: true });
-    }
+    };
     state = {
         profilephoto: '',
         hasimg: false
     };
 
-    saveImg = () =>{
-        this.props.changeUser({userImg:this.state.profilephoto});
+    saveImg = () => {
+        this.props.changeUser({ userImg: this.state.profilephoto });
 
         this.props.getCurrentUser();
         this.forceUpdate();
-    }
+    };
 
     render() {
         return (
             <div className="pageContainer">
-            <div className="reg-rectangle">
-                <h2 className="step-one">Step Two</h2>
-                <h2 className="the-basics">PROFILE PICTURE</h2>
-                <MuiThemeProvider>
-                <div className="pro-pic-placeholder" >
-                        {!this.state.hasimg ?
-                            <div className="upload-circle">
-                                <div className="plus-logo">
-                                    <div className="plus-horizontal" />
-                                    <div className="plus-vertical" />
+                <div className="regRectangle">
+                    <h2 className="stepHeading">Step Two</h2>
+                    <h2 className="titleHeading">PROFILE PICTURE</h2>
+                    <MuiThemeProvider>
+                        <div className="proPicPlaceholder">
+                            {!this.state.hasimg ? (
+                                <div className="uploadCircle">
+                                    <div className="plusLogo">
+                                        <div className="plusHorizontal" />
+                                        <div className="plusVertical" />
+                                    </div>
+                                    <input
+                                        type="file"
+                                        onChange={e => {
+                                            this.changeImg(e);
+                                        }}
+                                        style={inputimg}
+                                    />
                                 </div>
-                                <input
-                                    type="file"
-                                    onChange={e => {
-                                        this.changeImg(e);
+                            ) : (
+                                <img
+                                    src={this.state.profilephoto}
+                                    className="proPicJpg"
+                                    alt="Profile"
+                                />
+                            )}
+                        </div>
+                    </MuiThemeProvider>
+                    <div className="nextBox">
+                        <Route
+                            render={({ history }) => (
+                                <FlatButton
+                                    {...this.props}
+                                    onClick={() => {
+                                        this.saveImg();
+                                        history.push('/StepThree');
                                     }}
-                                    style={inputimg}
+                                    className="nextButton"
+                                    label="Next Step"
                                 />
-                            </div>
-                            :
-                            <img
-                                src={this.state.profilephoto}
-                                className="pro-pic-jpg"
-                                alt="Profile"
-                            />
-                        }
-
+                            )}
+                        />
+                    </div>
+                    <div className="skip2">
+                        <Route
+                            render={({ history }) => (
+                                <p
+                                    {...this.props}
+                                    onClick={() => {
+                                        this.setState({ logged: false });
+                                        history.push('/StepThree');
+                                    }}
+                                    className="skipForNow "
+                                    label="Next Step"
+                                >
+                                    Skip for now
+                                </p>
+                            )}
+                        />
                     </div>
-                </MuiThemeProvider>
-                <div className="nextBox">
-                    <Route render={({ history }) => (
-                        <FlatButton {...this.props} onClick={() => {
-                            this.saveImg()
-                            history.push('/StepThree')
-                        }}
-                            className="next-button-2"
-                            label="Next Step" />
-                    )} />
-                </div>
-                <div className="skip-2">
-                <Route render={({ history }) => (
-                        <p {...this.props} onClick={() => {
-                            this.setState({ logged: false })
-                            history.push('/StepThree')
-                        }}
-                        className="skip-for-now "
-                            label="Next Step" >Skip for now</p>
-                    )} />
-
                 </div>
             </div>
-            </div>
         );
     }
 }
@@ -123,21 +127,25 @@ const inputimg = {
     width: '100%'
 };
 const mapStateToProps = state => ({
-    chats:state.Chat.chats,
-    msgs:state.Chat.msgs,
+    chats: state.Chat.chats,
+    msgs: state.Chat.msgs,
     currentUser: state.Account.currentUser,
-    users: state.Account.users,
-  })
-
-  const mapDispatchToProps = dispatch => bindActionCreators({
-    getUser,
-    getCurrentUser,
-    changeUser,
-    addMsg,
-    getMsgs,
-    registerUser,
-    loginUser,
-    getChats
-  }, dispatch)
-
-  export default connect(mapStateToProps, mapDispatchToProps)(StepTwo);
+    users: state.Account.users
+});
+
+const mapDispatchToProps = dispatch =>
+    bindActionCreators(
+        {
+            getUser,
+            getCurrentUser,
+            changeUser,
+            addMsg,
+            getMsgs,
+            registerUser,
+            loginUser,
+            getChats
+        },
+        dispatch
+    );
+
+export default connect(mapStateToProps, mapDispatchToProps)(StepTwo);
diff --git a/src/reducers/Account.js b/src/reducers/Account.js
index 11e3212..30d04b7 100644
--- a/src/reducers/Account.js
+++ b/src/reducers/Account.js
@@ -12,7 +12,7 @@ export const CHANGE_SELECTED_CHAT = 'Account/CHANGE_SELECTED_CHAT';
 export const CHANGE_RECIEVER = 'Account/CHANGE_RECIEVER';
 export const ALL_USERS = 'Account/ALL_USERS';
 
-const link = 'http://192.168.0.20:54980';
+const link = 'http://192.168.0.20:52499';
 
 const initialState = {
     currentUserChats: [],
@@ -33,14 +33,10 @@ const initialState = {
 export default (state = initialState, action) => {
     switch (action.type) {
         case ALL_USERS:
-            alert('Got all users');
-            console.log('Got all users');
-
             var users = [];
 
             for (let i = 0; i < action.users.length; i++) {
-                alert(i + ' index');
-                users.push({
+              users.push({
                     userID: action.users[i].id,
                     userName: action.users[i].name,
                     userSurname: action.users[i].surname,
@@ -49,7 +45,7 @@ export default (state = initialState, action) => {
                 });
             }
 
-            alert(users.length + ' users in db');
+            console.log(users.length + ' users in db');
 
             return {
                 ...state,
@@ -67,15 +63,15 @@ export default (state = initialState, action) => {
             };
 
         case LOGIN_USER_ACCOUNT:
-            user = null;
-            for (let i = 0; i < state.users.length; i++) {
-                if (
-                    state.users[i].userEmail === action.user.userEmail &&
-                    state.users[i].userPassword === action.user.userPassword
-                ) {
-                    user = state.users[i];
-                }
-            }
+            var user = null;
+            user = action.user;
+            user.userID = action.user.id;
+            user.userName = action.user.name;
+            user.userSurname = action.user.surname;
+            user.userEmail = action.user.email;
+            user.userImg = action.user.image;
+
+            state.currentUser = user;
 
             return {
                 ...state,
@@ -88,7 +84,7 @@ export default (state = initialState, action) => {
             };
 
         case USER_ACCOUNT:
-            alert('here ....');
+            console.log('here ....');
             console.log('here ....');
             console.log(action.user);
             return {
@@ -119,17 +115,36 @@ export default (state = initialState, action) => {
             };
 
         case CURRENT_USER_CHATS:
-            console.log('dispatching CURRENT_USER_CHATS');
-            let msgs = action.allMsgs;
-            let userChats = [];
+            console.log("Are you sure")
+            var users = state.users;
+              for(let i=0;i<action.userChats.length;i++){
+                      for(let j=0;j<state.users.length;j++){
+                          if(state.users[j].userID !== state.currentUser.userID && state.users[j].userID == action.userChats[i].senderId){
 
+                            action.userChats[i].userID = state.users[j].userID;
+                            action.userChats[i].userName = state.users[j].userName;
+                            action.userChats[i].userImg = state.users[j].userImg;
+
+                          }else if(state.users[j].userID !== state.currentUser.userID && state.users[j].userID == action.userChats[i].receiverId){
+
+                              action.userChats[i].userID = state.users[j].userID;
+                              action.userChats[i].userName = state.users[j].userName;
+                              action.userChats[i].userImg = state.users[j].userImg;
+
+                          }
+                      }
+                      console.log(action.userChats.length+ " == " + i)
+              }
+            state.currentUserChats =  action.userChats;
+            state.filteredChats =  action.userChats;
+            console.log(state.filteredChats.length + " filteredChats");
+            console.log(action.userChats);
+            console.log("Done")
 
-            alert("Current user chats " + )
-            console.log(userChats);
             return {
                 ...state,
-                currentUserChats: userChats,
-                filteredChats: userChats
+                currentUserChats: action.userChats,
+                filteredChats: action.userChats
             };
 
         case FILTER_USER_CHATS:
@@ -187,7 +202,7 @@ export const changeSelectedChat = tempChats => {
 
 export const getUsers = () => {
     return dispatch => {
-        alert('About to');
+        console.log('About to');
         axios
             .get(link + '/api/Users/GetAllUsers')
             .then(function(response) {
@@ -198,44 +213,40 @@ export const getUsers = () => {
 };
 
 export const getUserChats = (userID) => {
-    return dispatch => {
+  return dispatch => {
         axios
-            .get(link + '/api/Chats/GetBySender/' + userID)
+            .get(link + '/api/Chats/getChatsforuser/' + userID)
             .then(function(response) {
-
-
-              for (let msg of msgs) {
-              {
-                  for (let user of state.users) {
-                      if (msg.senderId === user.userID || msg.receiverId === user.userID) {
-                          if (userChats.length > 0) {
-                              let duplicatefound = false;
-                              for (let userDet of userChats) {
-                                  if (userDet.userID === user.userID) {
-                                      userDet = user;
-                                      userDet.latestMessage = msg.text;
-                                      userDet.selected = false;
-                                      duplicatefound = true;
-                                  }
-                              }
-                              if (!duplicatefound) {
-                                  user.latestMessage = msg.text;
-                                  user.selected = false;
-                                  userChats.push(user);
-                              }
-                          } else {
-                              user.latestMessage = msg.text;
-                              user.selected = false;
-                              userChats.push(user);
-                          }
+                var userChats = []
+                var chat = response.data[0];
+                chat.latestMessage = response.data[0].text;
+                chat.selected = false;
+                userChats.push(chat);
+
+                for(let i=1;i<response.data.length;i++){
+                    let duplicatefound = false;
+                    for(let j=0;j<userChats.length;j++){
+                      if((response.data[i].senderId == userChats[j].senderId && response.data[i].receiverId == userChats[j].receiverId  || (response.data[i].senderId == userChats[j].receiverId && response.data[i].receiverId == userChats[j].senderId))){
+                        userChats[j].latestMessage = response.data[i].text;
+                        userChats[j].selected = false;
+                        duplicatefound = true;
                       }
+                    }
+                    if(!duplicatefound){
+                      chat = response.data[i];
+                      chat.latestMessage = response.data[i].text;
+                      chat.selected = false;
+                      userChats.push(chat);
+                    }
                   }
-              }
 
-              dispatch({ type: CURRENT_USER_CHATS, allChats: response.data });
+                  dispatch({ type: CURRENT_USER_CHATS, userChats: userChats });
             })
-            .catch(function(error) {});
-    };
+            .catch(function(error) {
+                console.log(error)
+                console.log("Server not running")
+            });
+          }
 };
 
 export const getCurrentUser = () => {
@@ -257,9 +268,20 @@ export const registerUser = user => {
 };
 
 export const loginUser = user => {
-    return dispatch => {
-        dispatch({ type: LOGIN_USER_ACCOUNT, user: user });
-    };
+  return dispatch => {
+      console.log('About to');
+      axios
+          .get(link + '/api/Users/GetAllUsers')
+          .then(function(response) {
+            for(let i =0;i<response.data.length;i++){
+                if(user.userEmail == response.data[i].email && user.userPassword == response.data[i].password){
+                  dispatch({ type: LOGIN_USER_ACCOUNT, user: response.data[i] });
+                  return;
+                }
+              }
+          })
+          .catch(function(error) {});
+  };
 };
 
 export const changeUser = changes => {
diff --git a/src/reducers/Chat.js b/src/reducers/Chat.js
index 1eae102..47e3189 100644
--- a/src/reducers/Chat.js
+++ b/src/reducers/Chat.js
@@ -4,8 +4,9 @@ import axios from 'axios';
 export const GET_CHATS = 'Chat/GET_CHATS';
 export const GET_MSGS = 'Chat/GET_MSGS';
 export const ADD_MSG = 'Chat/ADD_MSG';
+export const UPDATE_MSGS = 'Chat/UPDATE_MSGS'
 
-const link = 'http://192.168.0.20:54980';
+const link = 'http://192.168.0.20:52499';
 
 const initialState = {
     msgs: [{}],
@@ -17,8 +18,7 @@ const initialState = {
 export default (state = initialState, action) => {
     switch (action.type) {
         case ADD_MSG:
-            alert('Check your log file');
-            console.log(action.results);
+            console.log('Check your log file');
             return {
                 ...state
             };
@@ -26,12 +26,20 @@ export default (state = initialState, action) => {
         case GET_CHATS:
             var chats = action.chats;
             state.chats = chats;
-            alert('got ' + chats.length);
+            console.log('got ' + chats.length);
             return {
                 ...state,
                 chats: chats
             };
 
+        case UPDATE_MSGS:
+        console.log(state.reciever.receiverId + " is their id")
+          state.msgs = action.msgs;
+          return {
+              ...state,
+              msgs:action.msgs
+          }
+
         case GET_MSGS:
             //state.allMsgs = msgs;
             state.allMsgs = action.msgs;
@@ -39,7 +47,8 @@ export default (state = initialState, action) => {
 
             return {
                 ...state,
-                msgs: action.msgs
+                msgs: action.msgs,
+                allMsgs:action.msgs
             };
 
         default:
@@ -80,12 +89,29 @@ export const getMsgs = (senderId, receiverId) => {
                 });
             })
             .catch(function(error) {
-                alert('Error : sasasaffnasjfnaskjfasf ');
+                console.log('Error : sasasaffnasjfnaskjfasf ');
                 console.log(error);
             });
     };
 };
 
+export const updateMsgs = (senderID,receiverID) => {
+  return dispatch => {
+      var msgs = [];
+      axios.get(link + '/api/GetChatsBySR/' + senderID + '/' + receiverID )
+          .then(function(response) {
+              dispatch({
+                  type: UPDATE_MSGS,
+                  msgs: response.data
+              });
+          })
+          .catch(function(error) {
+              console.log('Error : sasasaffnasjfnaskjfasf ');
+              console.log(error);
+          });
+  };
+}
+
 export const addMsg = (msg, senderId, receiverId) => {
     return dispatch => {
         var newMsg = {
@@ -94,11 +120,11 @@ export const addMsg = (msg, senderId, receiverId) => {
             Text: msg
         };
 
-        axios
-            .post(link + '/api/chats', newMsg)
-            .then(function(response) {
+        if(receiverId != senderId){
+          axios.post(link + '/api/chats', newMsg).then(function(response) {
                 console.log(response);
-                alert('sent');
+                console.log('sent');
+
                 dispatch({
                     type: ADD_MSG,
                     msg: msg,
@@ -106,10 +132,12 @@ export const addMsg = (msg, senderId, receiverId) => {
                 });
 
                 getMsgs(senderId, receiverId);
-            })
-            .catch(function(error) {
-                alert('Error : safnasjfnaskjfasf ');
+            }).catch(function(error) {
+                console.log('Error : safnasjfnaskjfasf ');
                 console.log(error);
             });
+          }else{
+
+          }
     };
 };

From 0f8fcfe788c3f495674a1aa794579fcbecd468d4 Mon Sep 17 00:00:00 2001
From: Lavhe <mulavhe@gmail.com>
Date: Fri, 12 Jan 2018 15:59:13 +0200
Subject: [PATCH 8/8] After the last presentation

---
 src/components/accountScreen/accountScreen.js | 3 +--
 src/reducers/Account.js                       | 2 ++
 2 files changed, 3 insertions(+), 2 deletions(-)

diff --git a/src/components/accountScreen/accountScreen.js b/src/components/accountScreen/accountScreen.js
index 55bc388..4b6950b 100644
--- a/src/components/accountScreen/accountScreen.js
+++ b/src/components/accountScreen/accountScreen.js
@@ -277,8 +277,7 @@ class AccountScreen extends Component {
                             <li
                                 data-category={chat}
                                 key={chat}
-                                onClick={() => this.changeSelected(chat)}
-                            >
+                                onClick={() => this.changeSelected(chat)}>
                                 <ChatCard
                                     title={chat.userName}
                                     avatar={chat.userImg}
diff --git a/src/reducers/Account.js b/src/reducers/Account.js
index 30d04b7..a91ecad 100644
--- a/src/reducers/Account.js
+++ b/src/reducers/Account.js
@@ -135,6 +135,7 @@ export default (state = initialState, action) => {
                       }
                       console.log(action.userChats.length+ " == " + i)
               }
+
             state.currentUserChats =  action.userChats;
             state.filteredChats =  action.userChats;
             console.log(state.filteredChats.length + " filteredChats");
@@ -238,6 +239,7 @@ export const getUserChats = (userID) => {
                       chat.selected = false;
                       userChats.push(chat);
                     }
+
                   }
 
                   dispatch({ type: CURRENT_USER_CHATS, userChats: userChats });