Add unfollowing.

src/components/user_card_content/user_card_content.vue

@@ -13,6 +13,9 @@
           <div class="followed">
             <span v-if="user.following">
               Following them!
+              <button @click="unfollowUser">
+                Unfollow!
+              </button>
             </span>
             <span v-if="!user.following" >
               <button @click="followUser">
@@ -62,6 +65,11 @@
         const store = this.$store
         store.state.api.backendInteractor.followUser(this.user.id)
           .then((followedUser) => store.commit('addNewUsers', [followedUser]))
+      },
+      unfollowUser () {
+        const store = this.$store
+        store.state.api.backendInteractor.unfollowUser(this.user.id)
+          .then((unfollowedUser) => store.commit('addNewUsers', [unfollowedUser]))
       }
     }
   }

src/services/api/api.service.js

@@ -14,7 +14,7 @@ const CONVERSATION_URL = '/api/statusnet/conversation'
 const MENTIONS_URL = '/api/statuses/mentions.json'
 const FRIENDS_URL = '/api/statuses/friends.json'
 const FOLLOWING_URL = '/api/friendships/create.json'
-// const UNFOLLOWING_URL = '/api/friendships/create.json'
+const UNFOLLOWING_URL = '/api/friendships/destroy.json'
 // const USER_URL = '/api/users/show.json'
 
 const oldfetch = window.fetch
@@ -41,6 +41,14 @@ const followUser = ({id, credentials}) => {
   }).then((data) => data.json())
 }
 
+const unfollowUser = ({id, credentials}) => {
+  let url = `${UNFOLLOWING_URL}?user_id=${id}`
+  return fetch(url, {
+    headers: authHeaders(credentials),
+    method: 'POST'
+  }).then((data) => data.json())
+}
+
 const fetchFriends = ({credentials}) => {
   return fetch(FRIENDS_URL, { headers: authHeaders(credentials) })
     .then((data) => data.json())
@@ -155,6 +163,7 @@ const apiService = {
   fetchMentions,
   fetchFriends,
   followUser,
+  unfollowUser,
   favorite,
   unfavorite,
   retweet,

src/services/backend_interactor_service/backend_interactor_service.js

@@ -21,12 +21,17 @@ const backendInteractorService = (credentials) => {
     return apiService.followUser({credentials, id})
   }
 
+  const unfollowUser = (id) => {
+    return apiService.unfollowUser({credentials, id})
+  }
+
   const backendInteractorServiceInstance = {
     fetchStatus,
     fetchConversation,
     fetchMentions,
     fetchFriends,
     followUser,
+    unfollowUser,
     verifyCredentials: apiService.verifyCredentials
   }