summaryrefslogtreecommitdiff
path: root/src/client/app/common/views/components/note-menu.vue
blob: df52df26cb4616a3cd9bf2589529ca9c359bedf3 (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
<template>
<div style="position:initial">
	<mk-menu :source="source" :compact="compact" :items="items" @closed="closed"/>
</div>
</template>

<script lang="ts">
import Vue from 'vue';
import i18n from '../../../i18n';
import { url } from '../../../config';
import copyToClipboard from '../../../common/scripts/copy-to-clipboard';
import { concat, intersperse } from '../../../../../prelude/array';

export default Vue.extend({
	i18n: i18n('common/views/components/note-menu.vue'),
	props: ['note', 'source', 'compact'],
	computed: {
		items(): any[] {
			return concat(intersperse([null], [
				[
					[{
						icon: 'at',
						text: this.$t('mention'),
						action: this.mention
					}]
				],
				[
					[{
						icon: 'info-circle',
						text: this.$t('detail'),
						action: this.detail
					}], [{
						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');
						}
					}] : []
				],
				[
					this.note.isFavorited ? [{
						icon: 'star',
						text: this.$t('unfavorite'),
						action: this.unfavorite
					}] : [{
						icon: 'star',
						text: this.$t('favorite'),
						action: this.favorite
					}], 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.unpin
						} : {
								icon: 'thumbtack',
								text: this.$t('pin'),
								action: this.pin
							}
					] : []
				], [
					this.note.userId == this.$store.state.i.id || this.$store.state.i.isAdmin || this.$store.state.i.isModerator ? [{
						icon: ['far', 'trash-alt'],
						text: this.$t('delete'),
						action: this.del
					}] : []
				]
			].map(concat).filter(x => x.length > 0)));
		}
	},

	methods: {
		mention() {
			this.$post({ mention: this.note.user });
		},

		detail() {
			this.$router.push(`/notes/${this.note.id}`);
		},

		copyLink() {
			copyToClipboard(`${url}/notes/${this.note.id}`);
		},

		pin() {
			this.$root.api('i/pin', {
				noteId: this.note.id
			}).then(() => {
				this.$root.dialog({
					type: 'success',
					splash: true
				});
				this.destroyDom();
			});
		},

		unpin() {
			this.$root.api('i/unpin', {
				noteId: this.note.id
			}).then(() => {
				this.destroyDom();
			});
		},

		del() {
			this.$root.dialog({
				type: 'warning',
				text: this.$t('delete-confirm'),
				showCancelButton: true
			}).then(({ canceled }) => {
				if (canceled) return;

				this.$root.api('notes/delete', {
					noteId: this.note.id
				}).then(() => {
					this.destroyDom();
				});
			});
		},

		favorite() {
			this.$root.api('notes/favorites/create', {
				noteId: this.note.id
			}).then(() => {
				this.$root.dialog({
					type: 'success',
					splash: true
				});
				this.destroyDom();
			});
		},

		unfavorite() {
			this.$root.api('notes/favorites/delete', {
				noteId: this.note.id
			}).then(() => {
				this.$root.dialog({
					type: 'success',
					splash: true
				});
				this.destroyDom();
			});
		},

		closed() {
			this.$nextTick(() => {
				this.destroyDom();
			});
		}
	}
});
</script>