非ログイン時の警告処理 (#5219)

* Update note-mixin.ts

* Update note-mixin.ts

* :v:

* Update note-mixin.ts

* Update note-menu.vue

4 files changed, 103 insertions, 64 deletions

diff --git a/locales/ja-JP.yml b/locales/ja-JP.yml
index c34f398c94..d0a06e976d 100644
--- a/locales/ja-JP.yml
+++ b/locales/ja-JP.yml
@@ -37,6 +37,7 @@ common:
   reload-to-apply-the-setting: "この設定を反映するにはページをリロードする必要があります。今すぐリロードしますか？"
   fetching-as-ap-object: "連合に照会中"
   unfollow-confirm: "{name}さんをフォロー解除しますか？"
+  signin-required: "ログインしてください"
   notification-type: "通知の種類"
   notification-types:
     all: "すべて"
diff --git a/src/client/app/common/scripts/note-mixin.ts b/src/client/app/common/scripts/note-mixin.ts
index e649680070..fc82e78cec 100644
--- a/src/client/app/common/scripts/note-mixin.ts
+++ b/src/client/app/common/scripts/note-mixin.ts
@@ -3,6 +3,7 @@ import { sum, unique } from '../../../../prelude/array';
 import shouldMuteNote from './should-mute-note';
 import MkNoteMenu from '../views/components/note-menu.vue';
 import MkReactionPicker from '../views/components/reaction-picker.vue';
+import pleaseLogin from './please-login';
 
 function focus(el, fn) {
 	const target = fn(el);
@@ -108,6 +109,7 @@ export default (opts: Opts = {}) => ({
 
 	methods: {
 		reply(viaKeyboard = false) {
+			pleaseLogin(this.$root);
 			this.$root.$post({
 				reply: this.appearNote,
 				animation: !viaKeyboard,
@@ -118,6 +120,7 @@ export default (opts: Opts = {}) => ({
 		},
 
 		renote(viaKeyboard = false) {
+			pleaseLogin(this.$root);
 			this.$root.$post({
 				renote: this.appearNote,
 				animation: !viaKeyboard,
@@ -134,6 +137,7 @@ export default (opts: Opts = {}) => ({
 		},
 
 		react(viaKeyboard = false) {
+			pleaseLogin(this.$root);
 			this.blur();
 			this.$root.new(MkReactionPicker, {
 				source: this.$refs.reactButton,
@@ -159,6 +163,7 @@ export default (opts: Opts = {}) => ({
 		},
 
 		favorite() {
+			pleaseLogin(this.$root);
 			this.$root.api('notes/favorites/create', {
 				noteId: this.appearNote.id
 			}).then(() => {
diff --git a/src/client/app/common/scripts/please-login.ts b/src/client/app/common/scripts/please-login.ts
new file mode 100644
index 0000000000..7125541bb1
--- /dev/null
+++ b/src/client/app/common/scripts/please-login.ts
@@ -0,0 +1,10 @@
+export default ($root: any) => {
+	if ($root.$store.getters.isSignedIn) return;
+
+	$root.dialog({
+		title: $root.$t('@.signin-required'),
+		text: null
+	});
+
+	throw new Error('signin required');
+};
diff --git a/src/client/app/common/views/components/note-menu.vue b/src/client/app/common/views/components/note-menu.vue
index 6e2b778b32..e76e1a0b11 100644
--- a/src/client/app/common/views/components/note-menu.vue
+++ b/src/client/app/common/views/components/note-menu.vue
@@ -22,72 +22,95 @@ export default Vue.extend({
 	},
 	computed: {
 		items(): any[] {
-			return [{
-				icon: 'at',
-				text: this.$t('mention'),
-				action: this.mention
-			}, null, {
-				icon: 'info-circle',
-				text: this.$t('detail'),
-				action: this.detail
-			}, {
-				icon: faCopy,
-				text: this.$t('copy-content'),
-				action: this.copyContent
-			}, {
-				icon: 'link',
-				text: this.$t('copy-link'),
-				action: this.copyLink
-			}, this.note.uri ? {
-				icon: 'external-link-square-alt',
-				text: this.$t('remote'),
-				action: () => {
-					window.open(this.note.uri, '_blank');
-				}
-			} : undefined,
-			null,
-			this.isFavorited ? {
-				icon: 'star',
-				text: this.$t('unfavorite'),
-				action: () => this.toggleFavorite(false)
-			} : {
-				icon: 'star',
-				text: this.$t('favorite'),
-				action: () => this.toggleFavorite(true)
-			},
-			this.note.userId != this.$store.state.i.id ? this.isWatching ? {
-				icon: faEyeSlash,
-				text: this.$t('unwatch'),
-				action: () => this.toggleWatch(false)
-			} : {
-				icon: faEye,
-				text: this.$t('watch'),
-				action: () => this.toggleWatch(true)
-			} : undefined,
-			this.note.userId == this.$store.state.i.id ? (this.$store.state.i.pinnedNoteIds || []).includes(this.note.id) ? {
-				icon: 'thumbtack',
-				text: this.$t('unpin'),
-				action: () => this.togglePin(false)
-			} : {
-				icon: 'thumbtack',
-				text: this.$t('pin'),
-				action: () => this.togglePin(true)
-			} : undefined,
-			...(this.note.userId == this.$store.state.i.id || this.$store.state.i.isAdmin || this.$store.state.i.isModerator ? [
+			if (this.$store.getters.isSignedIn) {
+				return [{
+					icon: 'at',
+					text: this.$t('mention'),
+					action: this.mention
+				}, null, {
+					icon: 'info-circle',
+					text: this.$t('detail'),
+					action: this.detail
+				}, {
+					icon: faCopy,
+					text: this.$t('copy-content'),
+					action: this.copyContent
+				}, {
+					icon: 'link',
+					text: this.$t('copy-link'),
+					action: this.copyLink
+				}, this.note.uri ? {
+					icon: 'external-link-square-alt',
+					text: this.$t('remote'),
+					action: () => {
+						window.open(this.note.uri, '_blank');
+					}
+				} : undefined,
 				null,
-				this.note.userId == this.$store.state.i.id ? {
-					icon: 'undo-alt',
-					text: this.$t('delete-and-edit'),
-					action: this.deleteAndEdit
+				this.isFavorited ? {
+					icon: 'star',
+					text: this.$t('unfavorite'),
+					action: () => this.toggleFavorite(false)
+				} : {
+					icon: 'star',
+					text: this.$t('favorite'),
+					action: () => this.toggleFavorite(true)
+				},
+				this.note.userId != this.$store.state.i.id ? this.isWatching ? {
+					icon: faEyeSlash,
+					text: this.$t('unwatch'),
+					action: () => this.toggleWatch(false)
+				} : {
+					icon: faEye,
+					text: this.$t('watch'),
+					action: () => this.toggleWatch(true)
+				} : undefined,
+				this.note.userId == this.$store.state.i.id ? (this.$store.state.i.pinnedNoteIds || []).includes(this.note.id) ? {
+					icon: 'thumbtack',
+					text: this.$t('unpin'),
+					action: () => this.togglePin(false)
+				} : {
+					icon: 'thumbtack',
+					text: this.$t('pin'),
+					action: () => this.togglePin(true)
 				} : undefined,
-				{
-					icon: ['far', 'trash-alt'],
-					text: this.$t('delete'),
-					action: this.del
-				}]
-				: []
-			)]
-			.filter(x => x !== undefined)
+				...(this.note.userId == this.$store.state.i.id || this.$store.state.i.isAdmin || this.$store.state.i.isModerator ? [
+					null,
+					this.note.userId == this.$store.state.i.id ? {
+						icon: 'undo-alt',
+						text: this.$t('delete-and-edit'),
+						action: this.deleteAndEdit
+					} : undefined,
+					{
+						icon: ['far', 'trash-alt'],
+						text: this.$t('delete'),
+						action: this.del
+					}]
+					: []
+				)]
+				.filter(x => x !== undefined);
+			} else {
+				return [{
+					icon: 'info-circle',
+					text: this.$t('detail'),
+					action: this.detail
+				}, {
+					icon: faCopy,
+					text: this.$t('copy-content'),
+					action: this.copyContent
+				}, {
+					icon: 'link',
+					text: this.$t('copy-link'),
+					action: this.copyLink
+				}, this.note.uri ? {
+					icon: 'external-link-square-alt',
+					text: this.$t('remote'),
+					action: () => {
+						window.open(this.note.uri, '_blank');
+					}
+				} : undefined]
+				.filter(x => x !== undefined);
+			}
 		}
 	},