diff --git a/src/client/app/desktop/views/components/notifications.vue b/src/client/app/desktop/views/components/notifications.vue index aff21b14d8..368655095f 100644 --- a/src/client/app/desktop/views/components/notifications.vue +++ b/src/client/app/desktop/views/components/notifications.vue @@ -50,7 +50,7 @@ </div> </template> - <template v-if="notification.type == 'followRequest'"> + <template v-if="notification.type == 'reciveFollowRequest'"> <mk-avatar class="avatar" :user="notification.user"/> <div class="text"> <p>%fa:user-clock% @@ -268,7 +268,7 @@ root(isDark) .text p i color #53c7ce - &.followRequest + &.reciveFollowRequest .text p i color #888 diff --git a/src/client/app/mobile/views/components/follow-button.vue b/src/client/app/mobile/views/components/follow-button.vue index 9c363d7164..a247db95f6 100644 --- a/src/client/app/mobile/views/components/follow-button.vue +++ b/src/client/app/mobile/views/components/follow-button.vue @@ -1,14 +1,14 @@ <template> <button class="mk-follow-button" - :class="{ wait: wait, following: user.isFollowing, unfollow: user.isFollowing }" + :class="{ wait: wait, following: u.isFollowing }" @click="onClick" :disabled="wait" > <template v-if="!wait"> - <template v-if="user.hasPendingFollowRequestFromYou">%fa:hourglass-half% %i18n:@request-pending%</template> - <template v-else-if="user.isFollowing">%fa:minus% %i18n:@unfollow%</template> - <template v-else-if="!user.isFollowing && user.isLocked">%fa:plus% %i18n:@follow-request%</template> - <template v-else-if="!user.isFollowing && !user.isLocked">%fa:plus% %i18n:@follow%</template> + <template v-if="u.hasPendingFollowRequestFromYou">%fa:hourglass-half% %i18n:@request-pending%</template> + <template v-else-if="u.isFollowing">%fa:minus% %i18n:@unfollow%</template> + <template v-else-if="!u.isFollowing && u.isLocked">%fa:plus% %i18n:@follow-request%</template> + <template v-else-if="!u.isFollowing && !u.isLocked">%fa:plus% %i18n:@follow%</template> </template> <template v-else>%fa:spinner .pulse .fw%</template> </button> @@ -25,6 +25,7 @@ export default Vue.extend({ }, data() { return { + u: this.user, wait: false, connection: null, connectionId: null @@ -45,51 +46,44 @@ export default Vue.extend({ methods: { onFollow(user) { - if (user.id == this.user.id) { - this.user.isFollowing = user.isFollowing; + if (user.id == this.u.id) { + this.u.isFollowing = user.isFollowing; } }, onUnfollow(user) { - if (user.id == this.user.id) { - this.user.isFollowing = user.isFollowing; + if (user.id == this.u.id) { + this.u.isFollowing = user.isFollowing; } }, - onClick() { + async onClick() { this.wait = true; - if (this.user.isFollowing) { - (this as any).api('following/delete', { - userId: this.user.id - }).then(() => { - this.user.isFollowing = false; - }).catch(err => { - console.error(err); - }).then(() => { - this.wait = false; - }); - } else { - if (this.user.isLocked && this.user.hasPendingFollowRequestFromYou) { - (this as any).api('following/requests/cancel', { - userId: this.user.id - }).then(() => { - this.user.hasPendingFollowRequestFromYou = false; - }).catch(err => { - console.error(err); - }).then(() => { - this.wait = false; + + try { + if (this.u.isFollowing) { + this.u = await (this as any).api('following/delete', { + userId: this.u.id }); } else { - (this as any).api('following/create', { - userId: this.user.id - }).then(() => { - this.user.isFollowing = true; - }).catch(err => { - console.error(err); - }).then(() => { - this.wait = false; - }); + if (this.u.isLocked && this.u.hasPendingFollowRequestFromYou) { + this.u = await (this as any).api('following/requests/cancel', { + userId: this.u.id + }); + } else if (this.u.isLocked) { + this.u = await (this as any).api('following/create', { + userId: this.u.id + }); + } else { + this.u = await (this as any).api('following/create', { + userId: this.user.id + }); + } } + } catch (e) { + console.error(e); + } finally { + this.wait = false; } } } @@ -107,6 +101,8 @@ export default Vue.extend({ margin 0 line-height 36px font-size 14px + color $theme-color + background transparent outline none border solid 1px $theme-color border-radius 36px @@ -114,9 +110,9 @@ export default Vue.extend({ * pointer-events none - &.follow - color $theme-color - background transparent + &.following + color $theme-color-foreground + background $theme-color &:hover background rgba($theme-color, 0.1) @@ -124,10 +120,6 @@ export default Vue.extend({ &:active background rgba($theme-color, 0.2) - &.unfollow - color $theme-color-foreground - background $theme-color - &.wait cursor wait !important opacity 0.7 diff --git a/src/client/app/mobile/views/components/notification-preview.vue b/src/client/app/mobile/views/components/notification-preview.vue index b1f6fd1495..6046f77242 100644 --- a/src/client/app/mobile/views/components/notification-preview.vue +++ b/src/client/app/mobile/views/components/notification-preview.vue @@ -31,7 +31,7 @@ </div> </template> - <template v-if="notification.type == 'followRequest'"> + <template v-if="notification.type == 'reciveFollowRequest'"> <mk-avatar class="avatar" :user="notification.user"/> <div class="text"> <p>%fa:user-clock%{{ notification.user | userName }}</p> @@ -125,7 +125,7 @@ export default Vue.extend({ .text p i color #53c7ce - &.followRequest + &.reciveFollowRequest .text p i color #888 diff --git a/src/client/app/mobile/views/components/notification.vue b/src/client/app/mobile/views/components/notification.vue index da69fc79cc..8109bef38e 100644 --- a/src/client/app/mobile/views/components/notification.vue +++ b/src/client/app/mobile/views/components/notification.vue @@ -40,7 +40,7 @@ </div> </div> - <div class="notification followRequest" v-if="notification.type == 'followRequest'"> + <div class="notification followRequest" v-if="notification.type == 'reciveFollowRequest'"> <mk-avatar class="avatar" :user="notification.user"/> <div> <header> @@ -167,7 +167,7 @@ root(isDark) > div > header i color #53c7ce - &.followRequest + &.reciveFollowRequest > div > header i color #888 diff --git a/src/server/api/endpoints/following/create.ts b/src/server/api/endpoints/following/create.ts index 766a8c03d0..48205232e6 100644 --- a/src/server/api/endpoints/following/create.ts +++ b/src/server/api/endpoints/following/create.ts @@ -2,7 +2,7 @@ * Module dependencies */ import $ from 'cafy'; import ID from '../../../../cafy-id'; -import User from '../../../../models/user'; +import User, { pack } from '../../../../models/user'; import Following from '../../../../models/following'; import create from '../../../../services/following/create'; @@ -49,5 +49,5 @@ module.exports = (params, user) => new Promise(async (res, rej) => { create(follower, followee); // Send response - res(); + res(await pack(followee, user)); }); diff --git a/src/server/api/endpoints/following/delete.ts b/src/server/api/endpoints/following/delete.ts index 396b19a6f6..f4030c247a 100644 --- a/src/server/api/endpoints/following/delete.ts +++ b/src/server/api/endpoints/following/delete.ts @@ -2,7 +2,7 @@ * Module dependencies */ import $ from 'cafy'; import ID from '../../../../cafy-id'; -import User from '../../../../models/user'; +import User, { pack } from '../../../../models/user'; import Following from '../../../../models/following'; import deleteFollowing from '../../../../services/following/delete'; @@ -49,5 +49,5 @@ module.exports = (params, user) => new Promise(async (res, rej) => { deleteFollowing(follower, followee); // Send response - res(); + res(await pack(followee, user)); }); diff --git a/src/server/api/endpoints/following/requests/accept.ts b/src/server/api/endpoints/following/requests/accept.ts index f8df3b7850..705d3b161a 100644 --- a/src/server/api/endpoints/following/requests/accept.ts +++ b/src/server/api/endpoints/following/requests/accept.ts @@ -6,9 +6,9 @@ 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'); + // Get 'userId' parameter + const [followerId, followerIdErr] = $.type(ID).get(params.userId); + if (followerIdErr) return rej('invalid userId param'); // Fetch follower const follower = await User.findOne({ diff --git a/src/server/api/endpoints/following/requests/cancel.ts b/src/server/api/endpoints/following/requests/cancel.ts index 417422e06b..388a54890b 100644 --- a/src/server/api/endpoints/following/requests/cancel.ts +++ b/src/server/api/endpoints/following/requests/cancel.ts @@ -1,26 +1,26 @@ import $ from 'cafy'; import ID from '../../../../../cafy-id'; import cancelFollowRequest from '../../../../../services/following/requests/cancel'; -import User from '../../../../../models/user'; +import User, { pack } from '../../../../../models/user'; /** * Cancel 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'); + // Get 'userId' parameter + const [followeeId, followeeIdErr] = $.type(ID).get(params.userId); + if (followeeIdErr) return rej('invalid userId param'); - // Fetch follower - const follower = await User.findOne({ - _id: followerId + // Fetch followee + const followee = await User.findOne({ + _id: followeeId }); - if (follower === null) { - return rej('follower not found'); + if (followee === null) { + return rej('followee not found'); } - await cancelFollowRequest(user, follower); + await cancelFollowRequest(followee, user); // Send response - res(); + res(await pack(followee._id, user)); }); diff --git a/src/server/api/endpoints/following/requests/reject.ts b/src/server/api/endpoints/following/requests/reject.ts index 4900127a57..1cfb562b55 100644 --- a/src/server/api/endpoints/following/requests/reject.ts +++ b/src/server/api/endpoints/following/requests/reject.ts @@ -6,9 +6,9 @@ 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'); + // Get 'userId' parameter + const [followerId, followerIdErr] = $.type(ID).get(params.userId); + if (followerIdErr) return rej('invalid userId param'); // Fetch follower const follower = await User.findOne({ diff --git a/src/services/following/requests/create.ts b/src/services/following/requests/create.ts index 1285c21ea8..b69eb5acb0 100644 --- a/src/services/following/requests/create.ts +++ b/src/services/following/requests/create.ts @@ -33,10 +33,10 @@ export default async function(follower: IUser, followee: IUser) { // Publish reciveRequest event if (isLocalUser(followee)) { - packUser(follower, followee).then(packed => event(followee._id, 'reciveRequest', packed)), + packUser(follower, followee).then(packed => event(followee._id, 'reciveFollowRequest', packed)), // 通知を作成 - notify(followee._id, follower._id, 'reciveRequest'); + notify(followee._id, follower._id, 'reciveFollowRequest'); } if (isLocalUser(follower) && isRemoteUser(followee)) {