Merge pull request #772 from Shinsina/approved-comments-only

Display approved comments only
parameter1 · Aug 31, 2023 · e6cff73 · e6cff73
2 parents 8b31ddd + cd07354
commit e6cff73
Show file tree

Hide file tree

Showing 2 changed files with 13 additions and 5 deletions.
diff --git a/packages/marko-web-identity-x/browser/comments/post.vue b/packages/marko-web-identity-x/browser/comments/post.vue
@@ -3,7 +3,6 @@
     <div :class="element('header')">
       <div :class="element('display-name')">
         <span>Posted by {{ displayName }}</span>
-        <span v-if="!approved">(pending moderation)</span>
       </div>
       <div>
         <span :class="element('created-at')">

diff --git a/packages/marko-web-identity-x/browser/comments/stream.vue b/packages/marko-web-identity-x/browser/comments/stream.vue
@@ -49,8 +49,11 @@
         />
       </div>
 
-      <h5 v-if="latestCommentsHeader && comments.length" :class="element('latest-comments')">
-        {{ latestCommentsHeader }} ({{ totalCount }})
+      <h5
+        v-if="latestCommentsHeader && approvedComments.length"
+        :class="element('latest-comments')"
+      >
+        {{ latestCommentsHeader }} ({{ approvedComments.length }})
       </h5>
     </div>
     <div v-if="isLoading" :class="element('loading')">
@@ -59,12 +62,12 @@
     <div v-else-if="error" :class="element('error')">
       Unable to load comments: {{ error.message }}
     </div>
-    <div v-else-if="comments.length === 0" :class="element('no-posts')">
+    <div v-else-if="approvedComments.length === 0" :class="element('no-posts')">
       {{ noCommentsMessage }}
     </div>
     <div v-else :class="element('posts')">
       <div
-        v-for="comment in comments"
+        v-for="comment in approvedComments"
         :key="comment.id"
         :class="element('post')"
       >
@@ -231,6 +234,12 @@ export default {
     hasActiveUser() {
       return this.activeUser && this.activeUser.email;
     },
+    /**
+     *
+     */
+    approvedComments() {
+      return this.comments.filter((comment) => comment.approved);
+    },
   },
 
   /**