migrate SubscribeButton to the existing common component

This commit is contained in:
taehoon 2019-04-25 04:19:22 -04:00
parent d5e8315e83
commit 4cf402ff21
4 changed files with 16 additions and 51 deletions

View file

@ -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
})
}
}
}

View file

@ -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>

View file

@ -1,6 +1,6 @@
import UserAvatar from '../user_avatar/user_avatar.vue' import UserAvatar from '../user_avatar/user_avatar.vue'
import RemoteFollow from '../remote_follow/remote_follow.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 ModerationTools from '../moderation_tools/moderation_tools.vue'
import { hex2rgb } from '../../services/color_convert/color_convert.js' import { hex2rgb } from '../../services/color_convert/color_convert.js'
import { requestFollow, requestUnfollow } from '../../services/follow_manipulate/follow_manipulate' import { requestFollow, requestUnfollow } from '../../services/follow_manipulate/follow_manipulate'
@ -106,7 +106,7 @@ export default {
UserAvatar, UserAvatar,
RemoteFollow, RemoteFollow,
ModerationTools, ModerationTools,
SubscribeButton ProgressButton
}, },
methods: { methods: {
followUser () { followUser () {
@ -137,6 +137,12 @@ export default {
unmuteUser () { unmuteUser () {
this.$store.dispatch('unmuteUser', this.user.id) 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) { setProfileView (v) {
if (this.switcher) { if (this.switcher) {
const store = this.$store const store = this.$store

View file

@ -72,7 +72,14 @@
</button> </button>
</span> </span>
</div> </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'> <div class='mute' v-if='isOtherUser && loggedIn'>
<span v-if='user.muted'> <span v-if='user.muted'>
<button @click="unmuteUser" class="pressed"> <button @click="unmuteUser" class="pressed">