From 4cf402ff21c26fa9b82d2ea956ceb7ce8533146a Mon Sep 17 00:00:00 2001
From: taehoon <th.dev91@gmail.com>
Date: Thu, 25 Apr 2019 04:19:22 -0400
Subject: [PATCH] migrate SubscribeButton to the existing common component

---
 .../subscribe_button/subscribe_button.js      | 26 -------------------
 .../subscribe_button/subscribe_button.vue     | 22 ----------------
 src/components/user_card/user_card.js         | 10 +++++--
 src/components/user_card/user_card.vue        |  9 ++++++-
 4 files changed, 16 insertions(+), 51 deletions(-)
 delete mode 100644 src/components/subscribe_button/subscribe_button.js
 delete mode 100644 src/components/subscribe_button/subscribe_button.vue

diff --git a/src/components/subscribe_button/subscribe_button.js b/src/components/subscribe_button/subscribe_button.js
deleted file mode 100644
index e3a2842c..00000000
--- a/src/components/subscribe_button/subscribe_button.js
+++ /dev/null
@@ -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
-        })
-    }
-  }
-}
diff --git a/src/components/subscribe_button/subscribe_button.vue b/src/components/subscribe_button/subscribe_button.vue
deleted file mode 100644
index f7dd8c61..00000000
--- a/src/components/subscribe_button/subscribe_button.vue
+++ /dev/null
@@ -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>
diff --git a/src/components/user_card/user_card.js b/src/components/user_card/user_card.js
index bab1a654..d7fe71d0 100644
--- a/src/components/user_card/user_card.js
+++ b/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
diff --git a/src/components/user_card/user_card.vue b/src/components/user_card/user_card.vue
index 18ec6e94..e1d3f48f 100644
--- a/src/components/user_card/user_card.vue
+++ b/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">