Merge pull request #2845 from pixelfed/staging

Update Timeline.vue, fix comment button

CHANGELOG.md

@@ -50,6 +50,7 @@
 - Updated status views, remove like counts from status embed. ([1a2e41b1](https://github.com/pixelfed/pixelfed/commit/1a2e41b1))
 - Updated Profile, fix unauthenticated private profiles. ([9017f7c4](https://github.com/pixelfed/pixelfed/commit/9017f7c4))
 - Updated PublicApiController, impr home timeline perf. ([4fe42e5b](https://github.com/pixelfed/pixelfed/commit/4fe42e5b))
+- Updated Timeline.vue, fix comment button. ([b6b5ce7c](https://github.com/pixelfed/pixelfed/commit/b6b5ce7c))
 -  ([](https://github.com/pixelfed/pixelfed/commit/))
 
 ## [v0.11.0 (2021-06-01)](https://github.com/pixelfed/pixelfed/compare/v0.10.10...v0.11.0)

resources/assets/js/components/Profile.vue

@@ -424,7 +424,7 @@
 			<div class="list-group-item border-0 py-1" v-for="(user, index) in following" :key="'following_'+index">
 				<div class="media">
 					<a :href="profileUrlRedirect(user)">
-						<img class="mr-3 rounded-circle box-shadow" :src="user.avatar" :alt="user.username + '’s avatar'" width="30px" loading="lazy">
+						<img class="mr-3 rounded-circle box-shadow" :src="user.avatar" :alt="user.username + '’s avatar'" width="30px" loading="lazy" onerror="this.onerror=null;this.src='/storage/avatars/default.png?v=0'">
 					</a>
 					<div class="media-body text-truncate">
 						<p class="mb-0" style="font-size: 14px">
@@ -471,7 +471,7 @@
 			<div class="list-group-item border-0 py-1" v-for="(user, index) in followers" :key="'follower_'+index">
 				<div class="media mb-0">
 					<a :href="profileUrlRedirect(user)">
-						<img class="mr-3 rounded-circle box-shadow" :src="user.avatar" :alt="user.username + '’s avatar'" width="30px" height="30px" loading="lazy">
+						<img class="mr-3 rounded-circle box-shadow" :src="user.avatar" :alt="user.username + '’s avatar'" width="30px" height="30px" loading="lazy" onerror="this.onerror=null;this.src='/storage/avatars/default.png?v=0'">
 					</a>
 					<div class="media-body mb-0">
 						<p class="mb-0" style="font-size: 14px">

resources/assets/js/components/Timeline.vue

@@ -942,6 +942,64 @@
                 return;
             },
 
+            fetchStatusComments(status, card) {
+				let url = '/api/v2/comments/'+status.account.id+'/status/'+status.id;
+				axios.get(url)
+				.then(response => {
+					let self = this;
+					this.replies = _.reverse(response.data.data);
+					this.pagination = response.data.meta.pagination;
+					if(this.replies.length > 0) {
+						$('.load-more-link').removeClass('d-none');
+					}
+					$('.postCommentsLoader').addClass('d-none');
+					$('.postCommentsContainer').removeClass('d-none');
+					// setTimeout(function() {
+					// 	document.querySelectorAll('.status-comment .postCommentsContainer .comment-body a').forEach(function(i, e) {
+					// 		i.href = App.util.format.rewriteLinks(i);
+					// 	});
+					// }, 500);
+				}).catch(error => {
+					if(!error.response) {
+						$('.postCommentsLoader .lds-ring')
+						.attr('style','width:100%')
+						.addClass('pt-4 font-weight-bold text-muted')
+						.text('An error occurred, cannot fetch comments. Please try again later.');
+					} else {
+						switch(error.response.status) {
+							case 401:
+							$('.postCommentsLoader .lds-ring')
+							.attr('style','width:100%')
+							.addClass('pt-4 font-weight-bold text-muted')
+							.text('Please login to view.');
+							break;
+							default:
+							$('.postCommentsLoader .lds-ring')
+							.attr('style','width:100%')
+							.addClass('pt-4 font-weight-bold text-muted')
+							.text('An error occurred, cannot fetch comments. Please try again later.');
+							break;
+						}
+					}
+				});
+			},
+
+			statusUrl(status) {
+				if(status.local == true) {
+					return status.url;
+				}
+
+				return '/i/web/post/_/' + status.account.id + '/' + status.id;
+			},
+
+			profileUrl(status) {
+				if(status.local == true) {
+					return status.account.url;
+				}
+
+				return '/i/web/profile/_/' + status.account.id;
+			},
+
 			formatCount(count) {
 				return App.util.format.count(count);
 			},