confirm on user menu (#4553)

2 files changed, 36 insertions, 5 deletions

diff --git a/locales/ja-JP.yml b/locales/ja-JP.yml
index bcdda6c671..0836386c6c 100644
--- a/locales/ja-JP.yml
+++ b/locales/ja-JP.yml
@@ -527,8 +527,12 @@ common/views/components/user-menu.vue:
   mention: "メンション"
   mute: "ミュート"
   unmute: "ミュート解除"
+  mute-confirm: "このユーザーをミュートしますか？"
+  unmute-confirm: "このユーザーをミュート解除しますか？"
   block: "ブロック"
   unblock: "ブロック解除"
+  block-confirm: "このユーザーをブロックしますか？"
+  unblock-confirm: "このユーザーをブロック解除しますか？"
   push-to-list: "リストに追加"
   select-list: "リストを選択してください"
   report-abuse: "スパムを報告"
@@ -536,8 +540,12 @@ common/views/components/user-menu.vue:
   report-abuse-reported: "管理者に報告されました。ご協力ありがとうございました。"
   silence: "サイレンス"
   unsilence: "サイレンス解除"
+  silence-confirm: "このユーザーをサイレンスしますか？"
+  unsilence-confirm: "このユーザーをサイレンス解除しますか？"
   suspend: "凍結"
   unsuspend: "凍結解除"
+  suspend-confirm: "このユーザーを凍結しますか？"
+  unsuspend-confirm: "このユーザーを凍結解除しますか？"
 
 common/views/components/poll.vue:
   vote-to: "「{}」に投票する"
diff --git a/src/client/app/common/views/components/user-menu.vue b/src/client/app/common/views/components/user-menu.vue
index a95f7a9225..0af0fdb7e4 100644
--- a/src/client/app/common/views/components/user-menu.vue
+++ b/src/client/app/common/views/components/user-menu.vue
@@ -89,8 +89,10 @@ export default Vue.extend({
 			});
 		},
 
-		toggleMute() {
+		async toggleMute() {
 			if (this.user.isMuted) {
+				if (!await this.getConfirmed(this.$t('unmute-confirm'))) return;
+
 				this.$root.api('mute/delete', {
 					userId: this.user.id
 				}).then(() => {
@@ -102,6 +104,8 @@ export default Vue.extend({
 					});
 				});
 			} else {
+				if (!await this.getConfirmed(this.$t('mute-confirm'))) return;
+
 				this.$root.api('mute/create', {
 					userId: this.user.id
 				}).then(() => {
@@ -115,8 +119,10 @@ export default Vue.extend({
 			}
 		},
 
-		toggleBlock() {
+		async toggleBlock() {
 			if (this.user.isBlocking) {
+				if (!await this.getConfirmed(this.$t('unblock-confirm'))) return;
+
 				this.$root.api('blocking/delete', {
 					userId: this.user.id
 				}).then(() => {
@@ -128,6 +134,8 @@ export default Vue.extend({
 					});
 				});
 			} else {
+				if (!await this.getConfirmed(this.$t('block-confirm'))) return;
+
 				this.$root.api('blocking/create', {
 					userId: this.user.id
 				}).then(() => {
@@ -164,7 +172,9 @@ export default Vue.extend({
 			});
 		},
 
-		toggleSilence() {
+		async toggleSilence() {
+			if (!await this.getConfirmed(this.$t(this.user.isSilenced ? 'unsilence-confirm' : 'silence-confirm'))) return;
+
 			this.$root.api(this.user.isSilenced ? 'admin/unsilence-user' : 'admin/silence-user', {
 				userId: this.user.id
 			}).then(() => {
@@ -181,7 +191,9 @@ export default Vue.extend({
 			});
 		},
 
-		toggleSuspend() {
+		async toggleSuspend() {
+			if (!await this.getConfirmed(this.$t(this.user.isSuspended ? 'unsuspend-confirm' : 'suspend-confirm'))) return;
+
 			this.$root.api(this.user.isSuspended ? 'admin/unsuspend-user' : 'admin/suspend-user', {
 				userId: this.user.id
 			}).then(() => {
@@ -196,7 +208,18 @@ export default Vue.extend({
 					text: e
 				});
 			});
-		}
+		},
+
+		async getConfirmed(text: string): Promise<Boolean> {
+			const confirm = await this.$root.dialog({
+				type: 'warning',
+				showCancelButton: true,
+				title: 'confirm',
+				text,
+			});
+
+			return !confirm.canceled;
+		},
 	}
 });
 </script>