feat: Answer component

smooth-code · Jan 26, 2018 · b521d84 · b521d84
1 parent 88cf421
commit b521d84
Show file tree

Hide file tree

Showing 5 changed files with 252 additions and 3 deletions.
diff --git a/.gitignore b/.gitignore
@@ -2,3 +2,4 @@ node_modules/
 .next/
 lib/
 !db/structure.sql
+.env
diff --git a/components/Answer.js b/components/Answer.js
@@ -0,0 +1,21 @@
+/* eslint-disable jsx-a11y/label-has-for */
+import React from 'react'
+import ReactMarkdown from 'react-markdown'
+import 'prismjs'
+import Head from 'next/head'
+import PrismCode from 'react-prism'
+
+const code = { code: PrismCode }
+const Answer = ({ answer }) => (
+  <div>
+    <Head>
+      <link rel="stylesheet" href="/prism.css" />
+    </Head>
+    <label>
+      <input type="radio" />
+      {<ReactMarkdown source={answer} renderer={code} />}
+    </label>
+  </div>
+)
+
+export default Answer
diff --git a/components/Answer.test.js b/components/Answer.test.js
@@ -0,0 +1,10 @@
+import { shallow } from 'enzyme'
+import React from 'react'
+import Answer from './Answer'
+
+describe('#Answer', () => {
+  it('should render an answer component', () => {
+    const wrapper = shallow(<Answer answer="2 + 2 = 4" />)
+    expect(wrapper.find('ReactMarkdown').prop('source')).toEqual('2 + 2 = 4')
+  })
+})
diff --git a/package.json b/package.json
@@ -16,9 +16,12 @@
     "passport-github2": "^0.1.11",
     "pg": "^7.4.1",
     "polished": "^1.9.0",
+    "prismjs": "^1.10.0",
     "prop-types": "^15.6.0",
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
+    "react-markdown": "^3.1.4",
+    "react-prism": "^4.3.2",
     "styled-components": "^2.4.0"
   },
   "scripts": {
-Original file line number
+Diff line change
@@ Expand Up / @@ -2,3 +2,4 @@ node_modules/ @@
     .next/
     lib/
     !db/structure.sql
+    .env