wip

src/client/app/desktop/views/components/notifications.vue

@@ -5,6 +5,7 @@
 			<template v-for="(notification, i) in _notifications">
 				<div class="notification" :class="notification.type" :key="notification.id">
 					<mk-time :time="notification.createdAt"/>
+
 					<template v-if="notification.type == 'reaction'">
 						<mk-avatar class="avatar" :user="notification.user"/>
 						<div class="text">
@@ -17,6 +18,7 @@
 							</router-link>
 						</div>
 					</template>
+
 					<template v-if="notification.type == 'renote'">
 						<mk-avatar class="avatar" :user="notification.note.user"/>
 						<div class="text">
@@ -28,6 +30,7 @@
 							</router-link>
 						</div>
 					</template>
+
 					<template v-if="notification.type == 'quote'">
 						<mk-avatar class="avatar" :user="notification.note.user"/>
 						<div class="text">
@@ -37,6 +40,7 @@
 							<router-link class="note-preview" :to="notification.note | notePage">{{ getNoteSummary(notification.note) }}</router-link>
 						</div>
 					</template>
+
 					<template v-if="notification.type == 'follow'">
 						<mk-avatar class="avatar" :user="notification.user"/>
 						<div class="text">
@@ -45,6 +49,16 @@
 							</p>
 						</div>
 					</template>
+
+					<template v-if="notification.type == 'followRequest'">
+						<mk-avatar class="avatar" :user="notification.user"/>
+						<div class="text">
+							<p>%fa:user-clock%
+								<router-link :to="notification.user | userPage" v-user-preview="notification.user.id">{{ notification.user | userName }}</router-link>
+							</p>
+						</div>
+					</template>
+
 					<template v-if="notification.type == 'reply'">
 						<mk-avatar class="avatar" :user="notification.note.user"/>
 						<div class="text">
@@ -54,6 +68,7 @@
 							<router-link class="note-preview" :to="notification.note | notePage">{{ getNoteSummary(notification.note) }}</router-link>
 						</div>
 					</template>
+
 					<template v-if="notification.type == 'mention'">
 						<mk-avatar class="avatar" :user="notification.note.user"/>
 						<div class="text">
@@ -63,6 +78,7 @@
 							<a class="note-preview" :href="notification.note | notePage">{{ getNoteSummary(notification.note) }}</a>
 						</div>
 					</template>
+
 					<template v-if="notification.type == 'poll_vote'">
 						<mk-avatar class="avatar" :user="notification.user"/>
 						<div class="text">
@@ -73,6 +89,7 @@
 						</div>
 					</template>
 				</div>
+
 				<p class="date" v-if="i != notifications.length - 1 && notification._date != _notifications[i + 1]._date" :key="notification.id + '-time'">
 					<span>%fa:angle-up%{{ notification._datetext }}</span>
 					<span>%fa:angle-down%{{ _notifications[i + 1]._datetext }}</span>
@@ -251,6 +268,10 @@ root(isDark)
 					.text p i
 						color #53c7ce
 
+				&.followRequest
+					.text p i
+						color #888
+
 				&.reply, &.mention
 					.text p i
 						color #555

src/client/app/mobile/views/components/notification-preview.vue

@@ -1,7 +1,7 @@
 <template>
 <div class="mk-notification-preview" :class="notification.type">
 	<template v-if="notification.type == 'reaction'">
-		<img class="avatar" :src="`${notification.user.avatarUrl}?thumbnail&size=64`" alt="avatar"/>
+		<mk-avatar class="avatar" :user="notification.user"/>
 		<div class="text">
 			<p><mk-reaction-icon :reaction="notification.reaction"/>{{ notification.user | userName }}</p>
 			<p class="note-ref">%fa:quote-left%{{ getNoteSummary(notification.note) }}%fa:quote-right%</p>
@@ -9,7 +9,7 @@
 	</template>
 
 	<template v-if="notification.type == 'renote'">
-		<img class="avatar" :src="`${notification.note.user.avatarUrl}?thumbnail&size=64`" alt="avatar"/>
+		<mk-avatar class="avatar" :user="notification.note.user"/>
 		<div class="text">
 			<p>%fa:retweet%{{ notification.note.user | userName }}</p>
 			<p class="note-ref">%fa:quote-left%{{ getNoteSummary(notification.note.renote) }}%fa:quote-right%</p>
@@ -17,7 +17,7 @@
 	</template>
 
 	<template v-if="notification.type == 'quote'">
-		<img class="avatar" :src="`${notification.note.user.avatarUrl}?thumbnail&size=64`" alt="avatar"/>
+		<mk-avatar class="avatar" :user="notification.note.user"/>
 		<div class="text">
 			<p>%fa:quote-left%{{ notification.note.user | userName }}</p>
 			<p class="note-preview">{{ getNoteSummary(notification.note) }}</p>
@@ -25,14 +25,21 @@
 	</template>
 
 	<template v-if="notification.type == 'follow'">
-		<img class="avatar" :src="`${notification.user.avatarUrl}?thumbnail&size=64`" alt="avatar"/>
+		<mk-avatar class="avatar" :user="notification.user"/>
 		<div class="text">
 			<p>%fa:user-plus%{{ notification.user | userName }}</p>
 		</div>
 	</template>
 
+	<template v-if="notification.type == 'followRequest'">
+		<mk-avatar class="avatar" :user="notification.user"/>
+		<div class="text">
+			<p>%fa:user-clock%{{ notification.user | userName }}</p>
+		</div>
+	</template>
+
 	<template v-if="notification.type == 'reply'">
-		<img class="avatar" :src="`${notification.note.user.avatarUrl}?thumbnail&size=64`" alt="avatar"/>
+		<mk-avatar class="avatar" :user="notification.note.user"/>
 		<div class="text">
 			<p>%fa:reply%{{ notification.note.user | userName }}</p>
 			<p class="note-preview">{{ getNoteSummary(notification.note) }}</p>
@@ -40,7 +47,7 @@
 	</template>
 
 	<template v-if="notification.type == 'mention'">
-		<img class="avatar" :src="`${notification.note.user.avatarUrl}?thumbnail&size=64`" alt="avatar"/>
+		<mk-avatar class="avatar" :user="notification.note.user"/>
 		<div class="text">
 			<p>%fa:at%{{ notification.note.user | userName }}</p>
 			<p class="note-preview">{{ getNoteSummary(notification.note) }}</p>
@@ -48,7 +55,7 @@
 	</template>
 
 	<template v-if="notification.type == 'poll_vote'">
-		<img class="avatar" :src="`${notification.user.avatarUrl}?thumbnail&size=64`" alt="avatar"/>
+		<mk-avatar class="avatar" :user="notification.user"/>
 		<div class="text">
 			<p>%fa:chart-pie%{{ notification.user | userName }}</p>
 			<p class="note-ref">%fa:quote-left%{{ getNoteSummary(notification.note) }}%fa:quote-right%</p>
@@ -83,16 +90,14 @@ export default Vue.extend({
 		display block
 		clear both
 
-	img
+	> .avatar
 		display block
 		float left
-		min-width 36px
+		width 36px
-		min-height 36px
+		height 36px
-		max-width 36px
-		max-height 36px
 		border-radius 6px
 
-	.text
+	> .text
 		float right
 		width calc(100% - 36px)
 		padding-left 8px
@@ -120,6 +125,10 @@ export default Vue.extend({
 		.text p i
 			color #53c7ce
 
+	&.followRequest
+		.text p i
+			color #888
+
 	&.reply, &.mention
 		.text p i
 			color #fff

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

@@ -40,6 +40,17 @@
 		</div>
 	</div>
 
+	<div class="notification followRequest" v-if="notification.type == 'followRequest'">
+		<mk-avatar class="avatar" :user="notification.user"/>
+		<div>
+			<header>
+				%fa:user-clock%
+				<router-link :to="notification.user | userPage">{{ notification.user | userName }}</router-link>
+				<mk-time :time="notification.createdAt"/>
+			</header>
+		</div>
+	</div>
+
 	<div class="notification poll_vote" v-if="notification.type == 'poll_vote'">
 		<mk-avatar class="avatar" :user="notification.user"/>
 		<div>
@@ -156,6 +167,10 @@ root(isDark)
 			> div > header i
 				color #53c7ce
 
+		&.followRequest
+			> div > header i
+				color #888
+
 .mk-notification[data-darkmode]
 	root(true)
 

src/server/api/endpoints.ts

@@ -448,6 +448,16 @@ const endpoints: Endpoint[] = [
 		},
 		kind: 'following-write'
 	},
+	{
+		name: 'following/request/accept',
+		withCredential: true,
+		kind: 'following-write'
+	},
+	{
+		name: 'following/request/reject',
+		withCredential: true,
+		kind: 'following-write'
+	},
 	{
 		name: 'following/stalk',
 		withCredential: true,

src/server/api/endpoints/following/request/accept.ts

@@ -0,0 +1,26 @@
+import $ from 'cafy'; import ID from '../../../../../cafy-id';
+import acceptFollowRequest from '../../../../../services/user/accept-follow-request';
+import User from '../../../../../models/user';
+
+/**
+ * Accept a follow request
+ */
+module.exports = (params, user) => new Promise(async (res, rej) => {
+	// Get 'followerId' parameter
+	const [followerId, followerIdErr] = $.type(ID).get(params.followerId);
+	if (followerIdErr) return rej('invalid followerId param');
+
+	// Fetch follower
+	const follower = await User.findOne({
+		_id: followerId
+	});
+
+	if (follower === null) {
+		return rej('follower not found');
+	}
+
+	await acceptFollowRequest(user, follower);
+
+	// Send response
+	res();
+});

src/server/api/endpoints/following/request/reject.ts

@@ -0,0 +1,26 @@
+import $ from 'cafy'; import ID from '../../../../../cafy-id';
+import rejectFollowRequest from '../../../../../services/user/reject-follow-request';
+import User from '../../../../../models/user';
+
+/**
+ * Reject a follow request
+ */
+module.exports = (params, user) => new Promise(async (res, rej) => {
+	// Get 'followerId' parameter
+	const [followerId, followerIdErr] = $.type(ID).get(params.followerId);
+	if (followerIdErr) return rej('invalid followerId param');
+
+	// Fetch follower
+	const follower = await User.findOne({
+		_id: followerId
+	});
+
+	if (follower === null) {
+		return rej('follower not found');
+	}
+
+	await rejectFollowRequest(user, follower);
+
+	// Send response
+	res();
+});