Comment component shows content unless disabled

components/Comment.spec.js

@@ -39,6 +39,24 @@ describe('Comment.vue', () => {
         const wrapper = Wrapper()
         expect(wrapper.text()).toMatch('Hello I am a comment content')
       })
+
+      describe('which is disabled', () => {
+        beforeEach(() => {
+          propsData.comment.disabled = true
+        })
+
+        it('renders no comment data', () => {
+          const wrapper = Wrapper()
+          expect(wrapper.text()).not.toMatch('comment content')
+        })
+
+        it('translates a placeholder', () => {
+          const wrapper = Wrapper()
+          const calls = mocks.$t.mock.calls
+          const expected = [['comment.content.disabled-placeholder']]
+          expect(calls).toEqual(expect.arrayContaining(expected))
+        })
+      })
     })
   })
 })

components/Comment.vue

@@ -1,6 +1,11 @@
 <template>
   <div>
-  {{ comment.content }}
+    <div v-if="!disabled">
+      {{ comment.content }}
+    </div>
+    <div v-else>
+      {{ this.$t('comment.content.disabled-placeholder') }}
+    </div>
   </div>
 </template>
 
@@ -13,6 +18,11 @@ export default {
         return {}
       }
     }
+  },
+  computed: {
+    disabled() {
+      return this.comment.disabled
+    }
   }
 }
 </script>