Fix #3040

src/client/app/desktop/views/components/follow-button.vue

@@ -40,8 +40,8 @@ export default Vue.extend({
 
 	mounted() {
 		this.connection = (this as any).os.stream.useSharedConnection('main');
-		this.connection.on('follow', this.onFollow);
-		this.connection.on('unfollow', this.onUnfollow);
+		this.connection.on('follow', this.onFollowChange);
+		this.connection.on('unfollow', this.onFollowChange);
 	},
 
 	beforeDestroy() {
@@ -49,17 +49,11 @@ export default Vue.extend({
 	},
 
 	methods: {
-		onFollow(user) {
-			if (user.id == this.u.id) {
-				this.u.isFollowing = user.isFollowing;
-				this.u.hasPendingFollowRequestFromYou = user.hasPendingFollowRequestFromYou;
-			}
-		},
-
-		onUnfollow(user) {
+		onFollowChange(user) {
 			if (user.id == this.u.id) {
 				this.u.isFollowing = user.isFollowing;
 				this.u.hasPendingFollowRequestFromYou = user.hasPendingFollowRequestFromYou;
+				this.$forceUpdate();
 			}
 		},
 

src/client/app/mobile/views/components/follow-button.vue

@@ -17,6 +17,7 @@
 
 <script lang="ts">
 import Vue from 'vue';
+
 export default Vue.extend({
 	props: {
 		user: {
@@ -24,6 +25,7 @@ export default Vue.extend({
 			required: true
 		}
 	},
+
 	data() {
 		return {
 			u: this.user,
@@ -31,28 +33,24 @@ export default Vue.extend({
 			connection: null
 		};
 	},
+
 	mounted() {
 		this.connection = (this as any).os.stream.useSharedConnection('main');
 
-		this.connection.on('follow', this.onFollow);
-		this.connection.on('unfollow', this.onUnfollow);
+		this.connection.on('follow', this.onFollowChange);
+		this.connection.on('unfollow', this.onFollowChange);
 	},
+
 	beforeDestroy() {
 		this.connection.dispose();
 	},
+
 	methods: {
-
-		onFollow(user) {
-			if (user.id == this.u.id) {
-				this.u.isFollowing = user.isFollowing;
-				this.u.hasPendingFollowRequestFromYou = user.hasPendingFollowRequestFromYou;
-			}
-		},
-
-		onUnfollow(user) {
+		onFollowChange(user) {
 			if (user.id == this.u.id) {
 				this.u.isFollowing = user.isFollowing;
 				this.u.hasPendingFollowRequestFromYou = user.hasPendingFollowRequestFromYou;
+				this.$forceUpdate();
 			}
 		},
 
@@ -90,8 +88,6 @@ export default Vue.extend({
 </script>
 
 <style lang="stylus" scoped>
-
-
 .mk-follow-button
 	display block
 	user-select none

src/services/blocking/create.ts

@@ -60,7 +60,9 @@ async function cancelRequest(follower: IUser, followee: IUser) {
 	}
 
 	if (isLocalUser(follower)) {
-		packUser(followee, follower).then(packed => publishMainStream(follower._id, 'unfollow', packed));
+		packUser(followee, follower, {
+			detail: true
+		}).then(packed => publishMainStream(follower._id, 'unfollow', packed));
 	}
 
 	// リモートにフォローリクエストをしていたらUndoFollow送信
@@ -110,7 +112,9 @@ async function unFollow(follower: IUser, followee: IUser) {
 
 	// Publish unfollow event
 	if (isLocalUser(follower)) {
-		packUser(followee, follower).then(packed => publishMainStream(follower._id, 'unfollow', packed));
+		packUser(followee, follower, {
+			detail: true
+		}).then(packed => publishMainStream(follower._id, 'unfollow', packed));
 	}
 
 	// リモートにフォローをしていたらUndoFollow送信

src/services/following/create.ts

@@ -87,7 +87,9 @@ export default async function(follower: IUser, followee: IUser, requestId?: stri
 
 	// Publish follow event
 	if (isLocalUser(follower)) {
-		packUser(followee, follower).then(packed => publishMainStream(follower._id, 'follow', packed));
+		packUser(followee, follower, {
+			detail: true
+		}).then(packed => publishMainStream(follower._id, 'follow', packed));
 	}
 
 	// Publish followed event

src/services/following/delete.ts

@@ -42,7 +42,9 @@ export default async function(follower: IUser, followee: IUser) {
 
 	// Publish unfollow event
 	if (isLocalUser(follower)) {
-		packUser(followee, follower).then(packed => publishMainStream(follower._id, 'unfollow', packed));
+		packUser(followee, follower, {
+			detail: true
+		}).then(packed => publishMainStream(follower._id, 'unfollow', packed));
 	}
 
 	if (isLocalUser(follower) && isRemoteUser(followee)) {

src/services/following/requests/accept.ts

@@ -70,5 +70,7 @@ export default async function(followee: IUser, follower: IUser) {
 		detail: true
 	}).then(packed => publishMainStream(followee._id, 'meUpdated', packed));
 
-	packUser(followee, follower).then(packed => publishMainStream(follower._id, 'follow', packed));
+	packUser(followee, follower, {
+		detail: true
+	}).then(packed => publishMainStream(follower._id, 'follow', packed));
 }

src/services/following/requests/reject.ts

@@ -28,5 +28,7 @@ export default async function(followee: IUser, follower: IUser) {
 		}
 	});
 
-	packUser(followee, follower).then(packed => publishMainStream(follower._id, 'unfollow', packed));
+	packUser(followee, follower, {
+		detail: true
+	}).then(packed => publishMainStream(follower._id, 'unfollow', packed));
 }