migrate SubscribeButton to the existing common component

src/components/subscribe_button/subscribe_button.js

@@ -1,26 +0,0 @@
-export default {
-  props: [ 'user' ],
-  data () {
-    return {
-      inProgress: false
-    }
-  },
-  methods: {
-    subscribe () {
-      this.inProgress = true
-      this.$store.state.api.backendInteractor.subscribeUser(this.user.id)
-        .then((updated) => {
-          console.log(updated)
-          this.inProgress = false
-        })
-    },
-    unsubscribe () {
-      this.inProgress = true
-      this.$store.state.api.backendInteractor.unsubscribeUser(this.user.id)
-        .then((updated) => {
-          console.log(updated)
-          this.inProgress = false
-        })
-    }
-  }
-}

src/components/subscribe_button/subscribe_button.vue

@@ -1,22 +0,0 @@
-<template>
-  <div>
-    <button
-      @click.prevent="subscribe"
-      class="btn btn-default follow-card-follow-button"
-      :disabled="inProgress"
-      v-if="!user.subscribing"
-    >
-      Subscribe
-    </button>
-    <button
-      @click.prevent="unsubscribe"
-      class="btn btn-default follow-card-follow-button pressed"
-      :disabled="inProgress"
-      v-else
-    >
-      Subscribing!
-    </button>
-  </div>
-</template>
-
-<script src="./subscribe_button.js"></script>

src/components/user_card/user_card.js

@@ -1,6 +1,6 @@
 import UserAvatar from '../user_avatar/user_avatar.vue'
 import RemoteFollow from '../remote_follow/remote_follow.vue'
-import SubscribeButton from '../subscribe_button/subscribe_button.vue'
+import ProgressButton from '../progress_button/progress_button.vue'
 import ModerationTools from '../moderation_tools/moderation_tools.vue'
 import { hex2rgb } from '../../services/color_convert/color_convert.js'
 import { requestFollow, requestUnfollow } from '../../services/follow_manipulate/follow_manipulate'
@@ -106,7 +106,7 @@ export default {
     UserAvatar,
     RemoteFollow,
     ModerationTools,
-    SubscribeButton
+    ProgressButton
   },
   methods: {
     followUser () {
@@ -137,6 +137,12 @@ export default {
     unmuteUser () {
       this.$store.dispatch('unmuteUser', this.user.id)
     },
+    subscribeUser () {
+      return this.$store.state.api.backendInteractor.subscribeUser(this.user.id)
+    },
+    unsubscribeUser () {
+      return this.$store.state.api.backendInteractor.unsubscribeUser(this.user.id)
+    },
     setProfileView (v) {
       if (this.switcher) {
         const store = this.$store

src/components/user_card/user_card.vue

@@ -72,7 +72,14 @@
             </button>
           </span>
         </div>
-        <SubscribeButton :user="user" />
+        <div>
+          <ProgressButton :click="subscribeUser" v-if="!user.subscribing">
+            Subscribe
+          </ProgressButton>
+          <ProgressButton class="pressed" :click="unsubscribeUser" v-else>
+            Subscribing!
+          </ProgressButton>
+        </div>
         <div class='mute' v-if='isOtherUser && loggedIn'>
           <span v-if='user.muted'>
             <button @click="unmuteUser" class="pressed">