Page MenuHomePhorge
Files F85825419

No OneTemporary
Actions

Authored By
Unknown
Size
3 KB
Referenced Files
None
Subscribers
None

View Options

diff --git a/src/components/follow_button/follow_button.js b/src/components/follow_button/follow_button.js
index 3edbcb86fb..0a74a7a105 100644
--- a/src/components/follow_button/follow_button.js
+++ b/src/components/follow_button/follow_button.js
@@ -1,56 +1,79 @@
+import ConfirmModal from '../confirm_modal/confirm_modal.vue'
import { requestFollow, requestUnfollow } from '../../services/follow_manipulate/follow_manipulate'
export default {
props: ['relationship', 'user', 'labelFollowing', 'buttonClass'],
+ components: {
+ ConfirmModal
+ },
data () {
return {
- inProgress: false
+ inProgress: false,
+ showingConfirmUnfollow: false,
}
},
computed: {
+ shouldConfirmUnfollow () {
+ return this.$store.getters.mergedConfig.modalOnUnfollow
+ },
isPressed () {
return this.inProgress || this.relationship.following
},
title () {
if (this.inProgress || this.relationship.following) {
return this.$t('user_card.follow_unfollow')
} else if (this.relationship.requested) {
return this.$t('user_card.follow_cancel')
} else {
return this.$t('user_card.follow')
}
},
label () {
if (this.inProgress) {
return this.$t('user_card.follow_progress')
} else if (this.relationship.following) {
return this.labelFollowing || this.$t('user_card.following')
} else if (this.relationship.requested) {
return this.$t('user_card.follow_sent')
} else {
return this.$t('user_card.follow')
}
},
disabled () {
return this.inProgress || this.user.deactivated
}
},
methods: {
+ showConfirmUnfollow () {
+ this.showingConfirmUnfollow = true
+ },
+ hideConfirmUnfollow () {
+ this.showingConfirmUnfollow = false
+ },
onClick () {
this.relationship.following || this.relationship.requested ? this.unfollow() : this.follow()
},
follow () {
this.inProgress = true
requestFollow(this.relationship.id, this.$store).then(() => {
this.inProgress = false
})
},
unfollow () {
+ if (this.shouldConfirmUnfollow) {
+ this.showConfirmUnfollow()
+ } else {
+ this.doUnfollow()
+ }
+ },
+ doUnfollow () {
const store = this.$store
this.inProgress = true
requestUnfollow(this.relationship.id, store).then(() => {
this.inProgress = false
store.commit('removeStatus', { timeline: 'friends', userId: this.relationship.id })
})
+
+ this.hideConfirmUnfollow()
}
}
}
diff --git a/src/components/follow_button/follow_button.vue b/src/components/follow_button/follow_button.vue
index 965d5256a6..4fc2233a6b 100644
--- a/src/components/follow_button/follow_button.vue
+++ b/src/components/follow_button/follow_button.vue
@@ -1,13 +1,33 @@
<template>
- <button
- class="btn button-default follow-button"
- :class="{ toggled: isPressed }"
- :disabled="disabled"
- :title="title"
- @click="onClick"
- >
- {{ label }}
- </button>
+ <div>
+ <button
+ class="btn button-default follow-button"
+ :class="{ toggled: isPressed }"
+ :disabled="disabled"
+ :title="title"
+ @click="onClick"
+ >
+ {{ label }}
+ </button>
+ <confirm-modal
+ :showing="showingConfirmUnfollow"
+ :title="$t('user_card.unfollow_confirm_title')"
+ :confirm-text="$t('user_card.unfollow_confirm_accept_button')"
+ :cancel-text="$t('user_card.unfollow_confirm_cancel_button')"
+ @accepted="doUnfollow"
+ @cancelled="hideConfirmUnfollow"
+ >
+ <i18n
+ path="user_card.unfollow_confirm"
+ tag="span"
+ >
+ <span
+ place="user"
+ v-text="user.screen_name_ui"
+ />
+ </i18n>
+ </confirm-modal>
+ </div>
</template>
<script src="./follow_button.js"></script>

File Metadata

Mime Type
text/x-diff
Expires
Fri, Oct 30, 12:37 AM (1 d, 11 h)
Storage Engine
blob
Storage Format
Raw Data
Storage Handle
1799011
Default Alt Text
(3 KB)

Event Timeline