Refactoring for consistency

The disabled/deleted part comes first (similar to guard clauses)

components/Comment.vue

@@ -1,6 +1,16 @@
 <template>
-  <div :class="{'comment': true, 'disabled-content': (deleted && isModerator)}">
-    <div v-if="displaysComment">
+  <div v-if="(comment.deleted || comment.disabled) && !isModerator">
+    <ds-text
+      style="padding-left: 40px; font-weight: bold;"
+      color="soft"
+    >
+      <ds-icon name="ban" /> {{ this.$t('comment.content.unavailable-placeholder') }}
+    </ds-text>
+  </div>
+  <div
+    v-else
+    :class="{'comment': true, 'disabled-content': (comment.deleted || comment.disabled)}"
+  >
     <ds-space
       margin-bottom="x-small"
     >
@@ -22,15 +32,7 @@
       style="padding-left: 40px;"
       v-html="comment.contentExcerpt"
     />
-    </div>
   <!-- eslint-enable vue/no-v-html -->
-    <ds-text
-      v-else
-      style="padding-left: 40px; font-weight: bold;"
-      color="soft"
-    >
-      <ds-icon name="ban" /> {{ this.$t('comment.content.unavailable-placeholder') }}
-    </ds-text>
   </div>
 </template>
 
@@ -57,12 +59,8 @@ export default {
       user: 'auth/user',
       isModerator: 'auth/isModerator'
     }),
-    deleted() {
-      const { disabled, deleted } = this.comment
-      return disabled || deleted
-    },
     displaysComment() {
-      return !this.deleted || this.isModerator
+      return !this.unavailable || this.isModerator
     },
     author() {
       if (this.deleted) return {}

components/User.vue

@@ -1,5 +1,5 @@
 <template>
-  <div v-if="!user || (user.disabled && !isModerator)">
+  <div v-if="!user || ((user.disabled || user.deleted) && !isModerator)">
     <div style="display: inline-block; float: left; margin-right: 4px;  height: 100%; vertical-align: middle;">
       <ds-avatar
         style="display: inline-block; vertical-align: middle;"