diff --git a/src/components/card/CardSidebarTabComments.vue b/src/components/card/CardSidebarTabComments.vue
index ffbac760c..c12d2eff8 100644
--- a/src/components/card/CardSidebarTabComments.vue
+++ b/src/components/card/CardSidebarTabComments.vue
@@ -23,8 +23,8 @@
-
-
{{ t('deck', 'No comments yet. Begin the discussion!') }}
+
+
{{ error || t('deck', 'No comments yet. Begin the discussion!') }}
@@ -60,6 +60,7 @@ export default {
newComment: '',
isLoading: false,
currentUser: getCurrentUser(),
+ error: null,
}
},
computed: {
@@ -85,19 +86,33 @@ export default {
},
methods: {
async infiniteHandler($state) {
- await this.loadMore()
- if (this.hasMoreComments(this.card.id)) {
- $state.loaded()
- } else {
+ this.error = null
+ try {
+ await this.loadMore()
+ if (this.hasMoreComments(this.card.id)) {
+ $state.loaded()
+ } else {
+ $state.complete()
+ }
+ } catch (e) {
+ console.error('Failed to fetch more comments during infinite loading', e)
+ this.error = t('deck', 'Failed to load comments')
$state.complete()
}
},
async loadComments() {
+ this.error = null
this.isLoading = true
- await this.$store.dispatch('fetchComments', { cardId: this.card.id })
- this.isLoading = false
- if (this.card.commentsUnread > 0) {
- await this.$store.dispatch('markCommentsAsRead', this.card.id)
+ try {
+ await this.$store.dispatch('fetchComments', { cardId: this.card.id })
+ this.isLoading = false
+ if (this.card.commentsUnread > 0) {
+ await this.$store.dispatch('markCommentsAsRead', this.card.id)
+ }
+ } catch (e) {
+ this.isLoading = false
+ console.error('Failed to fetch more comments during infinite loading', e)
+ this.error = t('deck', 'Failed to load comments')
}
},
async createComment(content) {