Follow user (#133)

* Simple unfollow/following done * Follower/Following are now a part of the user type * follow and unfollow humans
Corporation-of-Doom · Nov 28, 2018 · 24e5c66 · 24e5c66
1 parent e0364c4
commit 24e5c66
Show file tree

Hide file tree

Showing 6 changed files with 99 additions and 6 deletions.
diff --git a/frontend/src/store.js b/frontend/src/store.js
@@ -171,7 +171,7 @@ export default new Vuex.Store({
     },
     loadUser(state, payload){
       state.otherUser = payload
-    }
+    },
   },
   getters: {
     layout(state, getters) {

diff --git a/frontend/src/views/pages/OtherUserProfile.vue b/frontend/src/views/pages/OtherUserProfile.vue
@@ -6,7 +6,8 @@
                     <font size="+2">{{user.first_name}} {{user.middle_name}} {{user.last_name}}</font>
                 </el-col>
                 <el-col v-if="user.privacy_settings !== 'Private'" :xs="24" :sm="12" :md="6" :lg="6" :xl="1" style="text-align:right">
-                    <el-button type="primary" title="Follow">Follow</el-button>                    
+                    <el-button v-if="!following" type="primary" @click="follow" title="Follow">Follow</el-button>  
+                    <el-button v-else-if="following" type="primary" @click="unfollow" plain title="Following">Following</el-button>                    
                 </el-col>
             </el-row>
             <el-col v-if="user.privacy_settings !== 'Private'">
@@ -72,14 +73,90 @@ export default {
 			color: 'white',
 			activeTab: 'profile',
 			affixEnabled: true,
+			following: this.$store.state.otherUser.following
 		}
     },
     mounted(){
         console.log(this.$store.state.otherUser)
     },
 	methods: {
-		onClick(id){
-			console.log(id)
+		follow(){
+			fetch({
+				query: `mutation { followUser(userID: ${this.$store.state.user.id}, followingID:${this.user.id}) {
+					id
+					email
+					first_name
+					middle_name
+					last_name
+					privacy_settings
+					linked_in
+					twitter
+					facebook
+					instagram
+					organization
+					about_me
+					landing_page
+					menu_orientation
+					phone_number
+					followers {
+					id
+					}
+					following {
+					id
+					}
+				}}`
+			})
+			.then(res => {
+				console.log(res)
+				if(res.data){
+					this.following = true;
+					this.$store.commit("setUser",res.data.followUser)
+				} else {
+					this.$message({
+						message: "Something went wrong following the user",
+						type: "error"
+					})
+				}
+			})
+		},
+		unfollow(){
+			fetch({
+				query: `mutation { unfollowUser(userID: ${this.$store.state.user.id}, followingID:${this.user.id}) {
+					id
+					email
+					first_name
+					middle_name
+					last_name
+					privacy_settings
+					linked_in
+					twitter
+					facebook
+					instagram
+					organization
+					about_me
+					landing_page
+					menu_orientation
+					phone_number
+					followers {
+					id
+					}
+					following {
+					id
+					}
+				}}`
+			})
+			.then(res => {
+				console.log(res)
+				if(res.data){
+					this.following = false;
+					this.$store.commit("setUser",res.data.unfollowUser)
+				} else {
+					this.$message({
+						message: "Something went wrong following the user",
+						type: "error"
+					})
+				}
+			})
 		}
 	},
 	components: {

diff --git a/frontend/src/views/pages/Settings.vue b/frontend/src/views/pages/Settings.vue
@@ -162,12 +162,12 @@ export default {
         if (res.data){ 
           this.$store.commit("setUser", {privacy_settings: event})
           this.$message({
-            message: 'Your landing page has been changed! :)',
+            message: 'Your privacy settings has been changed! :)',
             type: 'success'
           });
         } else {
           this.$message({
-            message: 'Something went wrong when updating your landing page. :(',
+            message: 'Something went wrong when updating your privacy settings. :(',
             type: 'error'
           });
         }

diff --git a/frontend/src/views/pages/UserSearch.vue b/frontend/src/views/pages/UserSearch.vue
@@ -122,11 +122,15 @@ export default {
               phone_number
               privacy_settings
               about_me
+              id
             } 
           }`
         })
         .then(res => {
           if(res.data.getUserById){
+            var info = res.data.getUserById
+            info.following = this.user.following.filter(user => user.id === id).length>0
+            
             this.$store.commit("loadUser",res.data.getUserById)
             this.$router.push("userprofile")
           } else {

diff --git a/frontend/src/views/pages/authentication/Login.vue b/frontend/src/views/pages/authentication/Login.vue
@@ -78,6 +78,12 @@ export default {
             landing_page
             menu_orientation
             phone_number
+            followers {
+              id
+            }
+            following {
+              id
+            }
           }
         }`
       })

diff --git a/frontend/src/views/pages/authentication/Register.vue b/frontend/src/views/pages/authentication/Register.vue
@@ -95,6 +95,12 @@ export default {
               organization
               landing_page
               menu_orientation
+              following{
+                id
+              }
+              followers{
+                id
+              }
             }
           }`,
           variables: {