diff --git a/web/src/components/Comment/Comment.stories.tsx b/web/src/components/Comment/Comment.stories.tsx
index 83dea125e..0cbe60ba2 100644
--- a/web/src/components/Comment/Comment.stories.tsx
+++ b/web/src/components/Comment/Comment.stories.tsx
@@ -1,14 +1,39 @@
 import Comment from './Comment'
 
-export const generated = () => {
+export const defaultView = () => {
   return (
-    <Comment
-      comment={{
-        name: 'Rob Cameron',
-        body: 'This is the first comment!',
-        createdAt: '2020-01-01T12:34:56Z',
-      }}
-    />
+    <div className="m-4">
+      <Comment
+        comment={{
+          id: 1,
+          name: 'Rob Cameron',
+          body: 'This is the first comment!',
+          createdAt: '2020-01-01T12:34:56Z',
+          postId: 1,
+        }}
+      />
+    </div>
+  )
+}
+
+export const moderatorView = () => {
+  mockCurrentUser({
+    roles: 'moderator',
+    id: 1,
+    email: 'moderator@moderator.com',
+  })
+  return (
+    <div className="m-4">
+      <Comment
+        comment={{
+          id: 1,
+          name: 'Rob Cameron',
+          body: 'This is the first comment!',
+          createdAt: '2020-01-01T12:34:56Z',
+          postId: 1,
+        }}
+      />
+    </div>
   )
 }