ハッシュタグ検索を実装

src/client/app/desktop/script.ts

@@ -33,6 +33,7 @@ import MkHomeCustomize from './views/pages/home-customize.vue';
 import MkMessagingRoom from './views/pages/messaging-room.vue';
 import MkNote from './views/pages/note.vue';
 import MkSearch from './views/pages/search.vue';
+import MkTag from './views/pages/tag.vue';
 import MkOthello from './views/pages/othello.vue';
 
 /**
@@ -60,6 +61,7 @@ init(async (launch) => {
 			{ path: '/i/lists/:list', component: MkUserList },
 			{ path: '/selectdrive', component: MkSelectDrive },
 			{ path: '/search', component: MkSearch },
+			{ path: '/tags/:tag', component: MkTag },
 			{ path: '/othello', component: MkOthello },
 			{ path: '/othello/:game', component: MkOthello },
 			{ path: '/@:user', component: MkUser },

src/client/app/desktop/views/components/note-detail.vue

@@ -48,7 +48,7 @@
 			<mk-poll v-if="p.poll" :note="p"/>
 			<mk-url-preview v-for="url in urls" :url="url" :key="url"/>
 			<div class="tags" v-if="p.tags && p.tags.length > 0">
-				<router-link v-for="tag in p.tags" :key="tag" :to="`/search?q=#${tag}`">{{ tag }}</router-link>
+				<router-link v-for="tag in p.tags" :key="tag" :to="`/tags/${tag}`">{{ tag }}</router-link>
 			</div>
 			<a class="location" v-if="p.geo" :href="`http://maps.google.com/maps?q=${p.geo.coordinates[1]},${p.geo.coordinates[0]}`" target="_blank">%fa:map-marker-alt% %i18n:@location%</a>
 			<div class="map" v-if="p.geo" ref="map"></div>

src/client/app/desktop/views/components/notes.note.vue

@@ -33,7 +33,7 @@
 					</div>
 					<mk-poll v-if="p.poll" :note="p" ref="pollViewer"/>
 					<div class="tags" v-if="p.tags && p.tags.length > 0">
-						<router-link v-for="tag in p.tags" :key="tag" :to="`/search?q=#${tag}`">{{ tag }}</router-link>
+						<router-link v-for="tag in p.tags" :key="tag" :to="`/tags/${tag}`">{{ tag }}</router-link>
 					</div>
 					<a class="location" v-if="p.geo" :href="`http://maps.google.com/maps?q=${p.geo.coordinates[1]},${p.geo.coordinates[0]}`" target="_blank">%fa:map-marker-alt% 位置情報</a>
 					<div class="map" v-if="p.geo" ref="map"></div>

src/client/app/desktop/views/pages/deck/deck.note.vue

@@ -33,7 +33,7 @@
 					</div>
 					<mk-poll v-if="p.poll" :note="p" ref="pollViewer"/>
 					<div class="tags" v-if="p.tags && p.tags.length > 0">
-						<router-link v-for="tag in p.tags" :key="tag" :to="`/search?q=#${tag}`">{{ tag }}</router-link>
+						<router-link v-for="tag in p.tags" :key="tag" :to="`/tags/${tag}`">{{ tag }}</router-link>
 					</div>
 					<a class="location" v-if="p.geo" :href="`http://maps.google.com/maps?q=${p.geo.coordinates[1]},${p.geo.coordinates[0]}`" target="_blank">%fa:map-marker-alt% %i18n:@location%</a>
 					<div class="renote" v-if="p.renote">

src/client/app/desktop/views/pages/tag.vue

@@ -0,0 +1,128 @@
+<template>
+<mk-ui>
+	<header :class="$style.header">
+		<h1>#{{ $route.params.tag }}</h1>
+	</header>
+	<div :class="$style.loading" v-if="fetching">
+		<mk-ellipsis-icon/>
+	</div>
+	<p :class="$style.empty" v-if="!fetching && empty">%fa:search%「{{ q }}」に関する投稿は見つかりませんでした。</p>
+	<mk-notes ref="timeline" :class="$style.notes" :more="existMore ? more : null"/>
+</mk-ui>
+</template>
+
+<script lang="ts">
+import Vue from 'vue';
+import Progress from '../../../common/scripts/loading';
+
+const limit = 20;
+
+export default Vue.extend({
+	data() {
+		return {
+			fetching: true,
+			moreFetching: false,
+			existMore: false,
+			offset: 0,
+			empty: false
+		};
+	},
+	watch: {
+		$route: 'fetch'
+	},
+	mounted() {
+		document.addEventListener('keydown', this.onDocumentKeydown);
+		window.addEventListener('scroll', this.onScroll, { passive: true });
+
+		this.fetch();
+	},
+	beforeDestroy() {
+		document.removeEventListener('keydown', this.onDocumentKeydown);
+		window.removeEventListener('scroll', this.onScroll);
+	},
+	methods: {
+		onDocumentKeydown(e) {
+			if (e.target.tagName != 'INPUT' && e.target.tagName != 'TEXTAREA') {
+				if (e.which == 84) { // t
+					(this.$refs.timeline as any).focus();
+				}
+			}
+		},
+		fetch() {
+			this.fetching = true;
+			Progress.start();
+
+			(this.$refs.timeline as any).init(() => new Promise((res, rej) => {
+				(this as any).api('notes/search_by_tag', {
+					limit: limit + 1,
+					offset: this.offset,
+					tag: this.$route.params.tag
+				}).then(notes => {
+					if (notes.length == 0) this.empty = true;
+					if (notes.length == limit + 1) {
+						notes.pop();
+						this.existMore = true;
+					}
+					res(notes);
+					this.fetching = false;
+					Progress.done();
+				}, rej);
+			}));
+		},
+		more() {
+			this.offset += limit;
+
+			const promise = (this as any).api('notes/search_by_tag', {
+				limit: limit + 1,
+				offset: this.offset,
+				tag: this.$route.params.tag
+			});
+
+			promise.then(notes => {
+				if (notes.length == limit + 1) {
+					notes.pop();
+				} else {
+					this.existMore = false;
+				}
+				notes.forEach(n => (this.$refs.timeline as any).append(n));
+				this.moreFetching = false;
+			});
+
+			return promise;
+		}
+	}
+});
+</script>
+
+<style lang="stylus" module>
+.header
+	width 100%
+	max-width 600px
+	margin 0 auto
+	color #555
+
+.notes
+	width 600px
+	margin 0 auto
+	border solid 1px rgba(#000, 0.075)
+	border-radius 6px
+	overflow hidden
+
+.loading
+	padding 64px 0
+
+.empty
+	display block
+	margin 0 auto
+	padding 32px
+	max-width 400px
+	text-align center
+	color #999
+
+	> [data-fa]
+		display block
+		margin-bottom 16px
+		font-size 3em
+		color #ccc
+
+</style>

src/client/app/mobile/views/components/note-detail.vue

@@ -41,7 +41,7 @@
 				<mk-note-html v-if="p.text" :text="p.text" :i="$store.state.i"/>
 			</div>
 			<div class="tags" v-if="p.tags && p.tags.length > 0">
-				<router-link v-for="tag in p.tags" :key="tag" :to="`/search?q=#${tag}`">{{ tag }}</router-link>
+				<router-link v-for="tag in p.tags" :key="tag" :to="`/tags/${tag}`">{{ tag }}</router-link>
 			</div>
 			<div class="media" v-if="p.media.length > 0">
 				<mk-media-list :media-list="p.media" :raw="true"/>

src/client/app/mobile/views/components/note.vue

@@ -33,7 +33,7 @@
 					</div>
 					<mk-poll v-if="p.poll" :note="p" ref="pollViewer"/>
 					<div class="tags" v-if="p.tags && p.tags.length > 0">
-						<router-link v-for="tag in p.tags" :key="tag" :to="`/search?q=#${tag}`">{{ tag }}</router-link>
+						<router-link v-for="tag in p.tags" :key="tag" :to="`/tags/${tag}`">{{ tag }}</router-link>
 					</div>
 					<mk-url-preview v-for="url in urls" :url="url" :key="url"/>
 					<a class="location" v-if="p.geo" :href="`http://maps.google.com/maps?q=${p.geo.coordinates[1]},${p.geo.coordinates[0]}`" target="_blank">%fa:map-marker-alt% %i18n:@location%</a>

src/models/note.ts

@@ -16,6 +16,7 @@ import Following from './following';
 const Note = db.get<INote>('notes');
 Note.createIndex('uri', { sparse: true, unique: true });
 Note.createIndex('userId');
+Note.createIndex('tags', { sparse: true });
 Note.createIndex({
 	createdAt: -1
 });

src/remote/activitypub/renderer/hashtag.ts

@@ -2,6 +2,6 @@ import config from '../../../config';
 
 export default tag => ({
 	type: 'Hashtag',
-	href: `${config.url}/search?q=#${encodeURIComponent(tag)}`,
+	href: `${config.url}/tags/${encodeURIComponent(tag)}`,
 	name: '#' + tag
 });

src/server/api/endpoints.ts

@@ -525,6 +525,9 @@ const endpoints: Endpoint[] = [
 	{
 		name: 'notes/search'
 	},
+	{
+		name: 'notes/search_by_tag'
+	},
 	{
 		name: 'notes/timeline',
 		withCredential: true,

src/server/api/endpoints/notes/search_by_tag.ts

@@ -0,0 +1,329 @@
+import $ from 'cafy'; import ID from '../../../../cafy-id';
+import Note from '../../../../models/note';
+import User from '../../../../models/user';
+import Mute from '../../../../models/mute';
+import { getFriendIds } from '../../common/get-friends';
+import { pack } from '../../../../models/note';
+
+/**
+ * Search notes by tag
+ */
+module.exports = (params, me) => new Promise(async (res, rej) => {
+	// Get 'tag' parameter
+	const [tag, tagError] = $.str.get(params.tag);
+	if (tagError) return rej('invalid tag param');
+
+	// Get 'includeUserIds' parameter
+	const [includeUserIds = [], includeUserIdsErr] = $.arr($.type(ID)).optional().get(params.includeUserIds);
+	if (includeUserIdsErr) return rej('invalid includeUserIds param');
+
+	// Get 'excludeUserIds' parameter
+	const [excludeUserIds = [], excludeUserIdsErr] = $.arr($.type(ID)).optional().get(params.excludeUserIds);
+	if (excludeUserIdsErr) return rej('invalid excludeUserIds param');
+
+	// Get 'includeUserUsernames' parameter
+	const [includeUserUsernames = [], includeUserUsernamesErr] = $.arr($.str).optional().get(params.includeUserUsernames);
+	if (includeUserUsernamesErr) return rej('invalid includeUserUsernames param');
+
+	// Get 'excludeUserUsernames' parameter
+	const [excludeUserUsernames = [], excludeUserUsernamesErr] = $.arr($.str).optional().get(params.excludeUserUsernames);
+	if (excludeUserUsernamesErr) return rej('invalid excludeUserUsernames param');
+
+	// Get 'following' parameter
+	const [following = null, followingErr] = $.bool.optional().nullable().get(params.following);
+	if (followingErr) return rej('invalid following param');
+
+	// Get 'mute' parameter
+	const [mute = 'mute_all', muteErr] = $.str.optional().get(params.mute);
+	if (muteErr) return rej('invalid mute param');
+
+	// Get 'reply' parameter
+	const [reply = null, replyErr] = $.bool.optional().nullable().get(params.reply);
+	if (replyErr) return rej('invalid reply param');
+
+	// Get 'renote' parameter
+	const [renote = null, renoteErr] = $.bool.optional().nullable().get(params.renote);
+	if (renoteErr) return rej('invalid renote param');
+
+	// Get 'media' parameter
+	const [media = null, mediaErr] = $.bool.optional().nullable().get(params.media);
+	if (mediaErr) return rej('invalid media param');
+
+	// Get 'poll' parameter
+	const [poll = null, pollErr] = $.bool.optional().nullable().get(params.poll);
+	if (pollErr) return rej('invalid poll param');
+
+	// Get 'sinceDate' parameter
+	const [sinceDate, sinceDateErr] = $.num.optional().get(params.sinceDate);
+	if (sinceDateErr) throw 'invalid sinceDate param';
+
+	// Get 'untilDate' parameter
+	const [untilDate, untilDateErr] = $.num.optional().get(params.untilDate);
+	if (untilDateErr) throw 'invalid untilDate param';
+
+	// Get 'offset' parameter
+	const [offset = 0, offsetErr] = $.num.optional().min(0).get(params.offset);
+	if (offsetErr) return rej('invalid offset param');
+
+	// Get 'limit' parameter
+	const [limit = 10, limitErr] = $.num.optional().range(1, 30).get(params.limit);
+	if (limitErr) return rej('invalid limit param');
+
+	let includeUsers = includeUserIds;
+	if (includeUserUsernames != null) {
+		const ids = (await Promise.all(includeUserUsernames.map(async (username) => {
+			const _user = await User.findOne({
+				usernameLower: username.toLowerCase()
+			});
+			return _user ? _user._id : null;
+		}))).filter(id => id != null);
+		includeUsers = includeUsers.concat(ids);
+	}
+
+	let excludeUsers = excludeUserIds;
+	if (excludeUserUsernames != null) {
+		const ids = (await Promise.all(excludeUserUsernames.map(async (username) => {
+			const _user = await User.findOne({
+				usernameLower: username.toLowerCase()
+			});
+			return _user ? _user._id : null;
+		}))).filter(id => id != null);
+		excludeUsers = excludeUsers.concat(ids);
+	}
+
+	search(res, rej, me, tag, includeUsers, excludeUsers, following,
+			mute, reply, renote, media, poll, sinceDate, untilDate, offset, limit);
+});
+
+async function search(
+	res, rej, me, tag, includeUserIds, excludeUserIds, following,
+	mute, reply, renote, media, poll, sinceDate, untilDate, offset, max) {
+
+	let q: any = {
+		$and: [{
+			tags: tag
+		}]
+	};
+
+	const push = x => q.$and.push(x);
+
+	if (includeUserIds && includeUserIds.length != 0) {
+		push({
+			userId: {
+				$in: includeUserIds
+			}
+		});
+	} else if (excludeUserIds && excludeUserIds.length != 0) {
+		push({
+			userId: {
+				$nin: excludeUserIds
+			}
+		});
+	}
+
+	if (following != null && me != null) {
+		const ids = await getFriendIds(me._id, false);
+		push({
+			userId: following ? {
+				$in: ids
+			} : {
+				$nin: ids.concat(me._id)
+			}
+		});
+	}
+
+	if (me != null) {
+		const mutes = await Mute.find({
+			muterId: me._id,
+			deletedAt: { $exists: false }
+		});
+		const mutedUserIds = mutes.map(m => m.muteeId);
+
+		switch (mute) {
+			case 'mute_all':
+				push({
+					userId: {
+						$nin: mutedUserIds
+					},
+					'_reply.userId': {
+						$nin: mutedUserIds
+					},
+					'_renote.userId': {
+						$nin: mutedUserIds
+					}
+				});
+				break;
+			case 'mute_related':
+				push({
+					'_reply.userId': {
+						$nin: mutedUserIds
+					},
+					'_renote.userId': {
+						$nin: mutedUserIds
+					}
+				});
+				break;
+			case 'mute_direct':
+				push({
+					userId: {
+						$nin: mutedUserIds
+					}
+				});
+				break;
+			case 'direct_only':
+				push({
+					userId: {
+						$in: mutedUserIds
+					}
+				});
+				break;
+			case 'related_only':
+				push({
+					$or: [{
+						'_reply.userId': {
+							$in: mutedUserIds
+						}
+					}, {
+						'_renote.userId': {
+							$in: mutedUserIds
+						}
+					}]
+				});
+				break;
+			case 'all_only':
+				push({
+					$or: [{
+						userId: {
+							$in: mutedUserIds
+						}
+					}, {
+						'_reply.userId': {
+							$in: mutedUserIds
+						}
+					}, {
+						'_renote.userId': {
+							$in: mutedUserIds
+						}
+					}]
+				});
+				break;
+		}
+	}
+
+	if (reply != null) {
+		if (reply) {
+			push({
+				replyId: {
+					$exists: true,
+					$ne: null
+				}
+			});
+		} else {
+			push({
+				$or: [{
+					replyId: {
+						$exists: false
+					}
+				}, {
+					replyId: null
+				}]
+			});
+		}
+	}
+
+	if (renote != null) {
+		if (renote) {
+			push({
+				renoteId: {
+					$exists: true,
+					$ne: null
+				}
+			});
+		} else {
+			push({
+				$or: [{
+					renoteId: {
+						$exists: false
+					}
+				}, {
+					renoteId: null
+				}]
+			});
+		}
+	}
+
+	if (media != null) {
+		if (media) {
+			push({
+				mediaIds: {
+					$exists: true,
+					$ne: null
+				}
+			});
+		} else {
+			push({
+				$or: [{
+					mediaIds: {
+						$exists: false
+					}
+				}, {
+					mediaIds: null
+				}]
+			});
+		}
+	}
+
+	if (poll != null) {
+		if (poll) {
+			push({
+				poll: {
+					$exists: true,
+					$ne: null
+				}
+			});
+		} else {
+			push({
+				$or: [{
+					poll: {
+						$exists: false
+					}
+				}, {
+					poll: null
+				}]
+			});
+		}
+	}
+
+	if (sinceDate) {
+		push({
+			createdAt: {
+				$gt: new Date(sinceDate)
+			}
+		});
+	}
+
+	if (untilDate) {
+		push({
+			createdAt: {
+				$lt: new Date(untilDate)
+			}
+		});
+	}
+
+	if (q.$and.length == 0) {
+		q = {};
+	}
+
+	// Search notes
+	const notes = await Note
+		.find(q, {
+			sort: {
+				_id: -1
+			},
+			limit: max,
+			skip: offset
+		});
+
+	// Serialize
+	res(await Promise.all(notes.map(note => pack(note, me))));
+}

src/text/html.ts

@@ -25,7 +25,7 @@ const handlers = {
 
 	hashtag({ document }, { hashtag }) {
 		const a = document.createElement('a');
-		a.href = config.url + '/search?q=#' + hashtag;
+		a.href = config.url + '/tags/' + hashtag;
 		a.textContent = '#' + hashtag;
 		a.setAttribute('rel', 'tag');
 		document.body.appendChild(a);