storing members in a single module.

src/components/app/MembersList.vue

@@ -16,10 +16,17 @@ export default {
   components: { MemberTemplate },
   computed: {
     members() {
+      const members = this.$store.getters['members/members'];
       const serverMembers = this.$store.getters['servers/serverMembers']
       const selectedServerID = this.$store.getters['servers/selectedServerID'];
 
-      return serverMembers.filter(sm => sm.server_id === selectedServerID).sort((a, b) => {
+      let filteredSM = serverMembers.filter(sm => sm.server_id === selectedServerID);
+
+      let getMember = filteredSM.map(sm => {
+        sm.member = members[sm.uniqueID];
+        return sm;
+      })
+      const sort = getMember.sort((a, b) => {
         var nameA = a.member.username.toUpperCase();
         var nameB = b.member.username.toUpperCase();
         if (nameA < nameB) {
@@ -30,6 +37,7 @@ export default {
         }
         return 0;
       })
+      return sort;
 
     }
   }

src/components/app/MessageTemplate.vue

@@ -350,6 +350,5 @@ img.emoji {
   height: 1.7em;
   width: auto;
   margin: 0 0.05em 0 0.1em;
-  vertical-align: -0.1em;
 }
 </style>

src/components/app/relationships/FriendsTemplate.vue

@@ -59,9 +59,10 @@ export default {
       return config.domain + "/avatars/" + this.recipient.avatar
     },
     status() {
+      const presences = this.$store.getters['members/presences'];
       let status = 0;
-      if (this.$store.getters.user.friends[this.recipient.uniqueID]) {
-        status = this.$store.getters.user.friends[this.recipient.uniqueID].recipient.status || 0
+      if (presences[this.recipient.uniqueID]) {
+        status = presences[this.recipient.uniqueID] || 0
       }
 
       return {

src/components/app/relationships/OfflineFriends.vue

@@ -27,10 +27,13 @@ export default {
   computed: {
     friends() {
       const allFriend = this.$store.getters.user.friends;
+      const members = this.$store.getters['members/members'];
+      const presences = this.$store.getters['members/presences'];
       const result = Object.keys(allFriend).map(function(key) {
+        allFriend[key].recipient = members[allFriend[key].uniqueID];
         return allFriend[key];
       });
-      return result.filter(friend => friend.status == 2 && (friend.recipient.status === undefined || friend.recipient.status == 0 ));
+      return result.filter(friend => friend.status == 2 && (!presences[friend.uniqueID] || presences[friend.uniqueID] == 0 ));
     }
   }
 }

src/components/app/relationships/OnlineFriends.vue

@@ -30,10 +30,14 @@ export default {
   computed: {
     friends() {
       const allFriend = this.$store.getters.user.friends;
+      const members = this.$store.getters['members/members'];
+      const presences = this.$store.getters['members/presences'];
       const notifications = this.$store.getters.notifications;
       const channels = this.$store.getters.channels;
+
       const result = Object.keys(allFriend).map(function(key) {
-        const friend = allFriend[key];
+        const friend = allFriend[key]; 
+        friend.recipient = members[friend.uniqueID];
         const findNotification = notifications.find( e => {
 
           return e.sender.uniqueID === friend.recipient.uniqueID && !channels[e.channelID].server_id
@@ -45,7 +49,7 @@ export default {
 
         return friend
       });
-      return result.filter(friend => friend.status == 2 && (friend.recipient.status !== undefined && friend.recipient.status > 0 ));
+      return result.filter(friend => friend.status == 2 && (presences[friend.uniqueID] && presences[friend.uniqueID] > 0 ));
     }
   }
 }

src/components/app/relationships/PendingFriends.vue

@@ -27,7 +27,9 @@ export default {
   computed: {
     friends() {
       const allFriend = this.$store.getters.user.friends;
+      const members = this.$store.getters['members/members'];
       const result = Object.keys(allFriend).map(function(key) {
+        allFriend[key].recipient = members[allFriend[key].uniqueID];
         return allFriend[key];
       });
       return result.filter(friend => friend.status < 2);

src/store/index.js

@@ -10,6 +10,7 @@ import uploadFilesModule from './modules/uploadFilesModule';
 import popoutsModule from './modules/popoutsModule/popoutsModule.js';
 import emojiSuggestionModule from './modules/emojiSuggestionModule';
 import serversModule from './modules/serversModule';
+import membersModule from './modules/membersModule';
 import {
   router
 } from './../router'
@@ -27,7 +28,8 @@ export const store = new Vuex.Store({
     uploadFilesModule,
     popoutsModule,
     emojiSuggestionModule,
-    servers: serversModule
+    servers: serversModule,
+    members: membersModule
   },
   state: {
     

src/store/modules/membersModule.js

@@ -0,0 +1,70 @@
+import { bus } from "../../main";
+import { router } from "./../../router";
+import Vue from "vue";
+
+const state = {
+  members: {},
+  presences: {}
+};
+
+const getters = {
+  members(state) {
+    return state.members;
+  },
+  presences(state) {
+    return state.presences;
+  }
+
+};
+
+const actions = {
+
+  addPresences(context, presences) {
+    context.commit('ADD_PRESENCES', presences);
+  },
+  updatePresence(context, {uniqueID, status}) {
+    context.commit('UPDATE_PRESENCE', {uniqueID, status});
+  },
+  addMembers(context, membersOBJ) {
+    context.commit('ADD_MEMBERS', membersOBJ);
+  },
+  addMember(context, member) {
+    context.commit('ADD_MEMBER', member);
+  },
+  removeMember(context, uniqueID) {
+    context.commit('REMOVE_MEMBER', uniqueID);
+  },
+  updateAvatar(context, {uniqueID, avatarID}) {
+    context.commit('UPDATE_AVATAR', {uniqueID, avatarID});
+  },
+};
+
+const mutations = {
+  ADD_PRESENCES(state, presences){
+    state.presences = {...state.presences, ...presences}
+  },
+  UPDATE_PRESENCE(state, {uniqueID, status}) {
+    Vue.set(state.presences, uniqueID, status);
+  },
+  ADD_MEMBERS(state, membersOBJ){
+    state.members = Object.assign(state.members, membersOBJ);
+  },
+  ADD_MEMBER(state, member) {
+    state.members[member.uniqueID] = member;
+  },
+  REMOVE_MEMBER(state, uniqueID) {
+    delete state.members[uniqueID];
+  },
+  UPDATE_AVATAR(state, {uniqueID, avatarID}) {
+    state.members[uniqueID].avatar = avatarID;
+  },
+
+};
+
+export default {
+  namespaced: true,
+  state,
+  actions,
+  mutations,
+  getters
+};

src/store/modules/serversModule.js

@@ -68,18 +68,18 @@ const mutations = {
   ADD_SERVER_MEMBERS(state, serverMembersArr) {
 
     for (let members of serverMembersArr) {
-      if (!state.serverMembers.find(sm => sm.member.uniqueID === members.member.uniqueID && sm.server_id === members.server_id)){
+      if (!state.serverMembers.find(sm => sm.uniqueID === members.uniqueID && sm.server_id === members.server_id)){
         state.serverMembers.push(members)
       }
     }
   },
   ADD_SERVER_MEMBER(state, serverMember) {
-    const exists = state.serverMembers.find(sm => sm.member.uniqueID === serverMember.member.uniqueID && sm.server_id === serverMember.server_id)
+    const exists = state.serverMembers.find(sm => sm.uniqueID === serverMember.uniqueID && sm.server_id === serverMember.server_id)
     if (exists) return;
     state.serverMembers.push(serverMember);
   },
   REMOVE_SERVER_MEMBER(state, {uniqueID, server_id}) {
-    state.serverMembers = state.serverMembers.filter(m => m.member.uniqueID !== uniqueID && m.server_id === server_id);
+    state.serverMembers = state.serverMembers.filter(m => m.uniqueID !== uniqueID && m.server_id === server_id);
   },
   SET_SELECTED_SERVER_ID(state, serverID){
     state.selectedServerID = serverID;

src/store/modules/socketIOModule.js

@@ -18,23 +18,53 @@ const actions = {
   socket_success(context, data) {
 
     const {message, user, serverMembers, dms, notifications, currentFriendStatus, settings} = data;
-    const friendsArray = user.friends;
-    const friendObject = {};
 
-    // convert array into object and add online status.
-    if(friendsArray !== undefined && friendsArray.length >=1) {
-      for (let index = 0; index < friendsArray.length; index++) {
-        const element = friendsArray[index];
-        if (element.recipient) {
-          friendObject[element.recipient.uniqueID] = element;
-          for (let currentFriendStatus of currentFriendStatus){
-            if(currentFriendStatus[0] == element.recipient.uniqueID){
-              friendObject[element.recipient.uniqueID].recipient.status = currentFriendStatus[1]
-            }
-          }
-        }
+
+    const friendsArr = user.friends;
+
+    const presence = {};
+    const friendObj = {};
+    const memberObj = {};
+    if (friendsArr) {
+      for ( let friend of friendsArr ){
+        const member = friend.recipient;
+        delete friend.recipient;
+        friend.uniqueID = member.uniqueID;
+        friendObj[member.uniqueID] = friend;
+        memberObj[member.uniqueID] = member;
       }
     }
+    if (currentFriendStatus) {
+      for (const _presence of currentFriendStatus) {
+        presence[_presence[0]] = _presence[1];
+      }
+    }
+
+    context.dispatch('members/addPresences', presence);
+
+    context.dispatch('members/addMembers', memberObj);
+
+
+
+
+    // const friendsArray = user.friends;
+    // const friendObject = {};
+
+    // // convert array into object and add online status.
+    // if(friendsArray !== undefined && friendsArray.length >=1) {
+    //   for (let index = 0; index < friendsArray.length; index++) {
+    //     const element = friendsArray[index];
+    //     if (element.recipient) {
+    //       friendObject[element.recipient.uniqueID] = element;
+    //       for (let currentFriendStatus of currentFriendStatus){
+    //         console.log(currentFriendStatus[0], currentFriendStatus[1])
+    //         if(currentFriendStatus[0] == element.recipient.uniqueID){
+    //           friendObject[element.recipient.uniqueID].recipient.status = currentFriendStatus[1]
+    //         }
+    //       }
+    //     }
+    //   }
+    // }
 
     let servers = user.servers || [];
     //convert array to object for servers
@@ -60,14 +90,24 @@ const actions = {
     context.dispatch('servers/setServers', servers)
 
     data.user.servers = undefined;
-    data.user.friends = friendObject;
+    data.user.friends = friendObj;
 
     context.commit('user', data.user)
 
     
     
     //server members
-    context.dispatch( 'servers/addServerMembers', serverMembers )
+    let serverMembersArr = [];
+    let membersObj = {};
+    for (let serverMember of serverMembers) {
+      const member = serverMember.member;
+      delete serverMember.member;
+      serverMember.uniqueID = member.uniqueID;
+      serverMembersArr.push(serverMember);
+      membersObj[member.uniqueID] = member;
+    }
+    context.dispatch('members/addMembers', membersObj);
+    context.dispatch( 'servers/addServerMembers', serverMembersArr )
 
 
     // convert dms array to object
@@ -84,6 +124,12 @@ const actions = {
 
   },
   socket_relationshipAdd(context, friend) {
+    const member = friend.recipient;
+    delete friend.recipient;
+    friend.uniqueID = member.uniqueID;
+    context.dispatch('members/updatePresence', {uniqueID: member.uniqueID, status: member.status})
+    delete member.status;
+    context.dispatch('members/addMember', member)
     context.commit('addFriend', friend)
   },
   socket_relationshipAccept(context, uniqueID) {
@@ -116,7 +162,8 @@ const actions = {
     context.dispatch('messageCreatedNotification', notification);
   },
   socket_userStatusChange(context, data) {
-    context.commit('userStatusChange', data)
+    if (context.rootState.user.user.uniqueID === data.uniqueID) return;
+    context.dispatch('members/updatePresence', {uniqueID: data.uniqueID, status: data.status})
   },
   socket_multiDeviceStatus(context, data) {
     context.commit('changeStatus', data.status)
@@ -128,7 +175,7 @@ const actions = {
     context.commit('changeAvatar', data.avatarID);
   },
   socket_userAvatarChange(context, data) {
-    context.commit('userAvatarChange', data)
+    context.commit('members/updateAvatar', data)
   },
   ['socket_channel:created'](context, data){
     const {channel} = data;
@@ -176,7 +223,14 @@ const actions = {
     context.dispatch('servers/removeServer', server_id)
   },
   ['socket_server:memberAdd'](context, {serverMember}) { // member_add
-    context.dispatch('servers/addServerMember', serverMember)
+    let sm = Object.assign({}, serverMember);
+    const member = sm.member;
+    delete sm.member;
+    sm.uniqueID = member.uniqueID;
+
+    context.dispatch('members/addMember', member)
+    context.dispatch('servers/addServerMember', sm)
+
     console.log("someone joined")
   },
   ['socket_server:memberRemove'](context, {uniqueID, server_id}) { // member_remove
@@ -184,6 +238,16 @@ const actions = {
     console.log("Someone left")
   },
   ['socket_server:members'](context, {serverMembers}) { // members
+    let serverMembersArr = [];
+    let members = {};
+    for (let serverMember of serverMembers) {
+      const member = serverMember.member;
+      delete serverMember.member;
+      serverMember.uniqueID = member.uniqueID;
+      serverMembersArr.push(serverMember);
+      members[member.uniqueID] = member;
+    }
+    context.dispatch('members/addMembers', members);
     context.dispatch('servers/addServerMembers', serverMembers)
     console.log("server members ")
   },

src/store/modules/userModule.js

@@ -52,18 +52,6 @@ const mutations = {
     //changes my status
     Vue.set(state.user, "status", status)
   },
-  userStatusChange(state, data) {
-    // changes friends status
-    const friends = state.user.friends;
-    friends[data.uniqueID].recipient.status = data.status;
-    state.user.friends = Object.assign({}, friends)
-  },
-  userAvatarChange(state, data) {
-    // changes friends status
-    const friends = state.user.friends;
-    friends[data.uniqueID].recipient.avatar = data.avatarID;
-    state.user.friends = Object.assign({}, friends)
-  },
   token(state, token) {
     axios.defaults.headers.common['authorization'] = token;
     localStorage.setItem('hauthid', token);
@@ -81,7 +69,7 @@ const mutations = {
   addFriend(state, friend) {
 
     const friends = state.user.friends;
-    friends[friend.recipient.uniqueID] = friend;
+    friends[friend.uniqueID] = friend;
 
     state.user.friends = Object.assign({}, friends)