Merge pull request #3176 from pixelfed/staging

Staging

app/Transformer/Api/StatusTransformer.php

@@ -16,6 +16,7 @@ use App\Services\StatusMentionService;
 use App\Services\ProfileService;
 use Illuminate\Support\Str;
 use App\Services\PollService;
+use App\Models\CustomEmoji;
 
 class StatusTransformer extends Fractal\TransformerAbstract
 {
@@ -36,7 +37,7 @@ class StatusTransformer extends Fractal\TransformerAbstract
 			'content'                   => $status->rendered ?? $status->caption,
 			'content_text'              => $status->caption,
 			'created_at'                => $status->created_at->format('c'),
-			'emojis'                    => [],
+			'emojis'                    => CustomEmoji::scan($status->caption),
 			'reblogs_count'             => 0,
 			'favourites_count'          => $status->likes_count ?? 0,
 			'reblogged'                 => $status->shared(),

public/mix-manifest.json

@@ -19,14 +19,14 @@
     "/js/discover.js": "/js/discover.js?id=32ad2e3e43a9b9c6d2c4",
     "/js/hashtag.js": "/js/hashtag.js?id=5dfd9c4873cc9d78727c",
     "/js/loops.js": "/js/loops.js?id=4ae79e81965c4fd1ae66",
-    "/js/profile.js": "/js/profile.js?id=a2711f99c3b45326226a",
+    "/js/profile.js": "/js/profile.js?id=a176e8efeecee79d80dd",
     "/js/profile-directory.js": "/js/profile-directory.js?id=f445e578219495c2b0f3",
-    "/js/rempos.js": "/js/rempos.js?id=19440e274a9139f12cd0",
-    "/js/rempro.js": "/js/rempro.js?id=50b56b25d6d72a192d64",
+    "/js/rempos.js": "/js/rempos.js?id=44a61814a65c98749e8c",
+    "/js/rempro.js": "/js/rempro.js?id=38df28bb47f4d8e99313",
     "/js/search.js": "/js/search.js?id=dc888b173463dc3894ba",
-    "/js/spa.js": "/js/spa.js?id=ffa082c6ae4baf2b134d",
-    "/js/status.js": "/js/status.js?id=f45b4a4f927fe287e7b2",
+    "/js/spa.js": "/js/spa.js?id=da51cdd9878d63b64ff4",
+    "/js/status.js": "/js/status.js?id=12003fb7fcda55bba597",
     "/js/stories.js": "/js/stories.js?id=f882708d5f00b4738dd7",
     "/js/story-compose.js": "/js/story-compose.js?id=0f9d2f7ce5e63ef14c6a",
-    "/js/timeline.js": "/js/timeline.js?id=6869d35cee0ed2035e7e"
+    "/js/timeline.js": "/js/timeline.js?id=0c422529ee173b0512e0"
 }

resources/assets/js/components/PostComponent.vue

@@ -125,7 +125,7 @@
 										<div v-else>
 											<p :class="[status.content.length > 620 ? 'mb-1 read-more' : 'mb-1']" style="overflow: hidden;">
 												<a class="font-weight-bold pr-1 text-dark text-decoration-none" :href="statusProfileUrl">{{statusUsername}}</a>
-												<span class="comment-text" :id="status.id + '-status-readmore'" v-html="status.content"></span>
+												<span class="comment-text" :id="status.id + '-status-readmore'" v-html="content"></span>
 											</p>
 										</div>
 										<hr>
@@ -953,7 +953,8 @@ export default {
 									})
 								}
 							]
-						}
+						},
+						content: undefined
 					}
 		},
 		watch: {
@@ -1027,6 +1028,11 @@ export default {
 								}
 								self.status = response.data.status;
 								self.media = self.status.media_attachments;
+								self.content = response.data.status.content;
+								self.status.emojis.forEach(function(emoji) {
+									let img = `<img draggable="false" class="emojione custom-emoji" alt="${emoji.shortcode}" title="${emoji.shortcode}" src="${emoji.url}" data-original="${emoji.url}" data-static="${emoji.static_url}" width="18" height="18" />`;
+									self.content = self.content.replace(`:${emoji.shortcode}:`, img);
+								});
 								self.likesPage = 2;
 								self.sharesPage = 2;
 								self.showCaption = !response.data.status.sensitive;

resources/assets/js/components/partials/StatusCard.vue

@@ -160,7 +160,7 @@
 						<span class="username font-weight-bold">
 							<bdi><a class="text-dark" :href="profileUrl(status)">{{status.account.username}}</a></bdi>
 						</span>
-						<span class="status-content" v-html="status.content"></span>
+						<span class="status-content" v-html="content"></span>
 					</p>
 				</div>
 				<div class="timestamp mt-2">
@@ -241,11 +241,18 @@
 				replyText: '',
 				replyNsfw: false,
 				emoji: window.App.util.emoji,
+				content: undefined
 			}
 		},
 
 		mounted() {
+			let self = this;
 			this.profile = window._sharedData.curUser;
+			this.content = this.status.content;
+			this.status.emojis.forEach(function(emoji) {
+				let img = `<img draggable="false" class="emojione custom-emoji" alt="${emoji.shortcode}" title="${emoji.shortcode}" src="${emoji.url}" data-original="${emoji.url}" data-static="${emoji.static_url}" width="18" height="18" />`;
+				self.content = self.content.replace(`:${emoji.shortcode}:`, img);
+			});
 		},
 
 		methods: {