dosc: add comment list story

webapp/components/CommentList/CommentList.story.js

@@ -0,0 +1,45 @@
+import { storiesOf } from '@storybook/vue'
+import { withA11y } from '@storybook/addon-a11y'
+import HcCommentList from './CommentList.vue'
+import helpers from '~/storybook/helpers'
+import faker from 'faker'
+
+helpers.init()
+
+const commentMock = fields => {
+  return {
+    id: faker.random.uuid(),
+    title: faker.lorem.sentence(),
+    content: faker.lorem.paragraph(),
+    createdAt: faker.date.past(),
+    updatedAt: faker.date.recent(),
+    deleted: false,
+    disabled: false,
+    ...fields,
+  }
+}
+
+const comments = [
+  commentMock(),
+  commentMock(),
+  commentMock(),
+  commentMock(),
+  commentMock(),
+  commentMock(),
+  commentMock(),
+  commentMock(),
+  commentMock(),
+  commentMock(),
+]
+
+storiesOf('CommentList', module)
+  .addDecorator(withA11y)
+  .addDecorator(helpers.layout)
+  .add('given 10 comments', () => ({
+    components: { HcCommentList },
+    store: helpers.store,
+    data: () => ({
+      post: { comments },
+    }),
+    template: `<hc-comment-list :post="post" />`,
+  }))

webapp/package.json

@@ -121,6 +121,7 @@
     "eslint-plugin-promise": "~4.2.1",
     "eslint-plugin-standard": "~4.0.1",
     "eslint-plugin-vue": "~5.2.3",
+    "faker": "^4.1.0",
     "flush-promises": "^1.0.2",
     "fuse.js": "^3.4.5",
     "identity-obj-proxy": "^3.0.0",

webapp/yarn.lock

@@ -7207,6 +7207,11 @@ extsprintf@^1.2.0:
   resolved "https://registry.yarnpkg.com/extsprintf/-/extsprintf-1.4.0.tgz#e2689f8f356fad62cca65a3a91c5df5f9551692f"
   integrity sha1-4mifjzVvrWLMplo6kcXfX5VRaS8=
 
+faker@^4.1.0:
+  version "4.1.0"
+  resolved "https://registry.yarnpkg.com/faker/-/faker-4.1.0.tgz#1e45bbbecc6774b3c195fad2835109c6d748cc3f"
+  integrity sha1-HkW7vsxndLPBlfrSg1EJxtdIzD8=
+
 fast-deep-equal@^2.0.1:
   version "2.0.1"
   resolved "https://registry.yarnpkg.com/fast-deep-equal/-/fast-deep-equal-2.0.1.tgz#7b05218ddf9667bf7f370bf7fdb2cb15fdd0aa49"