Skip to content
This repository has been archived by the owner on Aug 24, 2019. It is now read-only.

feat: Answer component #26

Merged
merged 1 commit into from
Jan 26, 2018
Merged

feat: Answer component #26

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
12 changes: 12 additions & 0 deletions components/Answer.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,12 @@
/* eslint-disable jsx-a11y/label-has-for */
import React from 'react'
import Markdown from './Markdown'

const Answer = ({ answer }) => (
<label>
<input type="radio" />
<Markdown source={answer} />
</label>
)

export default Answer
10 changes: 10 additions & 0 deletions components/Answer.test.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,10 @@
import { shallow } from 'enzyme'
import React from 'react'
import Answer from './Answer'

describe('#Answer', () => {
it('should render a question component using ReactMarkdown', () => {
const wrapper = shallow(<Answer answer="2 + 2 = 4" />)
expect(wrapper.find('Markdown').prop('source')).toEqual('2 + 2 = 4')
})
})
18 changes: 18 additions & 0 deletions components/Markdown.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,18 @@
import React from 'react'
import ReactMarkdown from 'react-markdown'
import 'prismjs'
import Head from 'next/head'
import PrismCode from 'react-prism'

const renderers = { code: PrismCode }

const Markdown = props => (
<React.Fragment>
<Head>
<link rel="stylesheet" href="/prism.css" data-noprefix />
</Head>
<ReactMarkdown renderer={renderers} {...props} />
</React.Fragment>
)

export default Markdown
15 changes: 2 additions & 13 deletions components/Question.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,17 +1,6 @@
import React from 'react'
import ReactMarkdown from 'react-markdown'
import 'prismjs'
import Head from 'next/head'
import PrismCode from 'react-prism'
import Markdown from './Markdown'

const codeRenderer = { code: PrismCode }
const Question = ({ question }) => (
<div>
<Head>
<link rel="stylesheet" href="/prism.css" data-noprefix />
</Head>
<ReactMarkdown source={question} renderer={codeRenderer} />
</div>
)
const Question = ({ question }) => <Markdown source={question} />

export default Question
4 changes: 2 additions & 2 deletions components/Question.test.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,8 +3,8 @@ import React from 'react'
import Question from './Question'

describe('#Question', () => {
it('should render a question component', () => {
it('should render a question component using ReactMarkdown', () => {
const wrapper = shallow(<Question question="2 + 2 ?" />)
expect(wrapper.find('ReactMarkdown').prop('source')).toEqual('2 + 2 ?')
expect(wrapper.find('Markdown').prop('source')).toEqual('2 + 2 ?')
})
})
1 change: 1 addition & 0 deletions package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -16,6 +16,7 @@
"passport-github2": "^0.1.11",
"pg": "^7.4.1",
"polished": "^1.9.0",
"prismjs": "^1.10.0",
"prop-types": "^15.6.0",
"prismjs": "^1.10.0",
"react": "^16.2.0",
Expand Down