diff --git a/src/atoms/Attachment.js b/src/atoms/Attachment.js
index 2afd1925ea5fb2f6f06edb8df369e37b0aa269dc..9f9be1d4982afa1ac866ecaf7c6ab965693612f6 100644
--- a/src/atoms/Attachment.js
+++ b/src/atoms/Attachment.js
@@ -3,15 +3,11 @@ import Icon from './Icon'
import classes from './Attachment.local.scss'
const Attachment = ({ value }) => (
- <a
- download={value.name}
- href={value.url}>
+ <a download={value.name} href={value.url}>
<span className={classes.icon}>
<Icon color="var(--color-primary)">paperclip</Icon>
</span>
- <span className={classes.filename}>
- {value.name}
- </span>
+ <span className={classes.filename}>{value.name}</span>
</a>
)
diff --git a/src/atoms/Badge.js b/src/atoms/Badge.js
index d5ee2d540495389646254e2fec0a1e1d10768e6c..eb6f00420bc27789af4fc134841df0fd81c1ef54 100644
--- a/src/atoms/Badge.js
+++ b/src/atoms/Badge.js
@@ -4,7 +4,9 @@ import classes from './Badge.local.scss'
const Badge = ({ count, label, plural }) => (
<span className={classes.root}>
<span className={classes.count}>{count}</span>
- <span className={classes.label}>{plural && count !== 1 ? plural : label}</span>
+ <span className={classes.label}>
+ {plural && count !== 1 ? plural : label}
+ </span>
</span>
)
diff --git a/src/atoms/Button.js b/src/atoms/Button.js
index c15cb9a47710b95234f09a35b36d83f44c289948..fe4d1f00441f862ffc3c04291982d0f7f2b0fef9 100644
--- a/src/atoms/Button.js
+++ b/src/atoms/Button.js
@@ -2,16 +2,25 @@ import React from 'react'
import classnames from 'classnames'
import classes from './Button.local.scss'
-const Button = ({ className, children, type = 'button', disabled, primary, onClick}) => (
+const Button = ({
+ className,
+ children,
+ type = 'button',
+ disabled,
+ primary,
+ onClick,
+}) => (
<button
className={classnames(className, classes.root, {
[classes.disabled]: disabled,
- [classes.primary]: primary
+ [classes.primary]: primary,
})}
type={type}
disabled={disabled}
- onClick={onClick}>{children}</button>
+ onClick={onClick}
+ >
+ {children}
+ </button>
)
export default Button
-
diff --git a/src/atoms/Checkbox.js b/src/atoms/Checkbox.js
index 8dde21105feae9b353897c64821815a7f39ebf7b..724e07de2db45a25b61e1548efca333a2a6990ba 100644
--- a/src/atoms/Checkbox.js
+++ b/src/atoms/Checkbox.js
@@ -2,10 +2,20 @@ import React from 'react'
import classnames from 'classnames'
import classes from './Checkbox.local.scss'
-const Checkbox = ({ inline, name, value, label, checked, required, onChange }) => (
- <label className={classnames(classes.root, {
- [classes.inline]: inline
- })}>
+const Checkbox = ({
+ inline,
+ name,
+ value,
+ label,
+ checked,
+ required,
+ onChange,
+}) => (
+ <label
+ className={classnames(classes.root, {
+ [classes.inline]: inline,
+ })}
+ >
<input
className={classes.input}
type="checkbox"
@@ -13,7 +23,8 @@ const Checkbox = ({ inline, name, value, label, checked, required, onChange }) =
value={value}
checked={checked || false}
required={required}
- onChange={onChange}/>
+ onChange={onChange}
+ />
<span>{label}</span>
</label>
)
diff --git a/src/atoms/File.js b/src/atoms/File.js
index 4eca93ba0063d5827a56c45719243b6567e95606..3d067485309574b5194e8a87a3c18bb259e1cc4c 100644
--- a/src/atoms/File.js
+++ b/src/atoms/File.js
@@ -6,9 +6,7 @@ const extension = ({ name }) => name.replace(/^.+\./, '')
const File = ({ value }) => (
<div className={classes.root}>
<div className={classes.icon}>
- <div className={classes.extension}>
- {extension(value)}
- </div>
+ <div className={classes.extension}>{extension(value)}</div>
</div>
<div className={classes.name}>
diff --git a/src/atoms/Icon.js b/src/atoms/Icon.js
index 672dd89160f75034e09f31ed24755842f1bcd6b2..26a904615c5d9d4477665a7fe0b268d440657177 100644
--- a/src/atoms/Icon.js
+++ b/src/atoms/Icon.js
@@ -10,9 +10,7 @@ const Icon = ({ children, color = 'black', size = 24 }) => {
// select the icon
const icon = icons[name]
- return (
- <span className={classes.root}>{icon({ color, size })}</span>
- )
+ return <span className={classes.root}>{icon({ color, size })}</span>
}
export default Icon
diff --git a/src/atoms/Menu.js b/src/atoms/Menu.js
index 3029ee3e20eefdacf327e293a0f49f3e2a188377..466ef18523516e85a97f083f1a6bf4345483ec82 100644
--- a/src/atoms/Menu.js
+++ b/src/atoms/Menu.js
@@ -6,25 +6,25 @@ import classes from './Menu.local.scss'
// TODO: use a <select> element instead of divs?
class Menu extends React.Component {
- constructor (props) {
+ constructor(props) {
super(props)
this.state = {
open: false,
- selected: props.value
+ selected: props.value,
}
}
toggleMenu = () => {
this.setState({
- open: !this.state.open
+ open: !this.state.open,
})
}
handleSelect = selected => {
this.setState({
selected,
- open: false
+ open: false,
})
this.props.onChange(selected)
@@ -36,24 +36,25 @@ class Menu extends React.Component {
return options.find(option => option.value === value).label
}
- render () {
+ render() {
const { label, options, placeholder = 'Choose in the list' } = this.props
const { open, selected } = this.state
return (
- <div className={classnames(classes.root, {
- [classes.open]: open
- })}>
- {label && (
- <span className={classes.label}>{label}</span>
- )}
+ <div
+ className={classnames(classes.root, {
+ [classes.open]: open,
+ })}
+ >
+ {label && <span className={classes.label}>{label}</span>}
<div className={classes.main}>
<div className={classes.openerContainer}>
<button
type="button"
className={classes.opener}
- onClick={this.toggleMenu}>
+ onClick={this.toggleMenu}
+ >
{selected ? (
<span>{this.optionLabel(selected)}</span>
) : (
@@ -70,10 +71,12 @@ class Menu extends React.Component {
<div
key={option.value}
className={classnames(classes.option, {
- [classes.active]: option.value === selected
+ [classes.active]: option.value === selected,
})}
onClick={() => this.handleSelect(option.value)}
- >{option.label || option.value}</div>
+ >
+ {option.label || option.value}
+ </div>
))}
</div>
)}
diff --git a/src/atoms/Radio.js b/src/atoms/Radio.js
index 48e34fddd5416f87a9c8fb539b33807761e3af1f..5df779152b64b0ddf25716d0c4735cd207e08ef7 100644
--- a/src/atoms/Radio.js
+++ b/src/atoms/Radio.js
@@ -2,13 +2,33 @@ import React from 'react'
import classnames from 'classnames'
import classes from './Radio.local.scss'
-const inputGradient = color => `radial-gradient(closest-corner at center, ${color} 0%, ${color} 45%, white 45%, white 100%)`
+const inputGradient = color =>
+ `radial-gradient(closest-corner at center, ${color} 0%, ${
+ color
+ } 45%, white 45%, white 100%)`
-const Radio = ({ className, color = 'black', inline, name, value, label, checked, required, onChange }) => (
- <label className={classnames(classes.root, {
- [classes.inline]: inline,
- [classes.checked]: checked
- }, className)} style={{color}}>
+const Radio = ({
+ className,
+ color = 'black',
+ inline,
+ name,
+ value,
+ label,
+ checked,
+ required,
+ onChange,
+}) => (
+ <label
+ className={classnames(
+ classes.root,
+ {
+ [classes.inline]: inline,
+ [classes.checked]: checked,
+ },
+ className,
+ )}
+ style={{ color }}
+ >
<input
className={classes.input}
type="radio"
@@ -16,10 +36,14 @@ const Radio = ({ className, color = 'black', inline, name, value, label, checked
value={value}
checked={checked}
required={required}
- onChange={onChange}/>
+ onChange={onChange}
+ />
<span
className={classes.pseudoInput}
- style={{ background: checked ? inputGradient(color) : 'transparent' }}> </span>
+ style={{ background: checked ? inputGradient(color) : 'transparent' }}
+ >
+ {' '}
+ </span>
<span className={classes.label}>{label}</span>
</label>
)
diff --git a/src/atoms/Tags.js b/src/atoms/Tags.js
index 63fe2c53cce7bc247ae9de6bac07b6f0ddea71ad..1c863b81fc84d0bd96f76166e44dfa99b4d77552 100644
--- a/src/atoms/Tags.js
+++ b/src/atoms/Tags.js
@@ -6,11 +6,11 @@ import './Tags.scss'
// TODO: allow tags to be edited
class Tags extends React.Component {
- constructor (props) {
+ constructor(props) {
super(props)
this.state = {
- tags: props.value || []
+ tags: props.value || [],
}
}
@@ -34,7 +34,7 @@ class Tags extends React.Component {
this.props.onChange(tags)
}
- render () {
+ render() {
const { tags } = this.state
const { name, suggestions, placeholder } = this.props
@@ -50,7 +50,8 @@ class Tags extends React.Component {
// delimiters={[]}
// delimiterChars={[',', ';']}
handleDelete={this.handleDelete}
- handleAddition={this.handleAddition}/>
+ handleAddition={this.handleAddition}
+ />
)
}
}
diff --git a/src/atoms/TextField.js b/src/atoms/TextField.js
index 4b4b8f94a913bf5106226a43cb453db55fe30da7..b0e7b021804127acb86bb50817954cb3158ea931 100644
--- a/src/atoms/TextField.js
+++ b/src/atoms/TextField.js
@@ -1,7 +1,16 @@
import React from 'react'
import classes from './TextField.local.scss'
-const TextField = ({ label, name, placeholder, required, type = 'text', value = '', onBlur, onChange }) => (
+const TextField = ({
+ label,
+ name,
+ placeholder,
+ required,
+ type = 'text',
+ value = '',
+ onBlur,
+ onChange,
+}) => (
<label className={classes.root}>
{label && <span className={classes.text}>{label}</span>}
<input
@@ -12,7 +21,8 @@ const TextField = ({ label, name, placeholder, required, type = 'text', value =
placeholder={placeholder}
required={required}
onBlur={onBlur}
- onChange={onChange}/>
+ onChange={onChange}
+ />
</label>
)
diff --git a/src/atoms/UploadingFile.js b/src/atoms/UploadingFile.js
index ecb3a865608797b9f52fdfff04701e0ccd618102..cc08f6fed15e2c2e651ac46c9ad1ab3595f10273 100644
--- a/src/atoms/UploadingFile.js
+++ b/src/atoms/UploadingFile.js
@@ -7,22 +7,17 @@ const extension = ({ name }) => name.replace(/^.+\./, '')
const UploadingFile = ({ file, error, progress }) => (
<div className={classes.root}>
- {!!error && (
- <div className={classes.error}>
- {error}
- </div>
- )}
+ {!!error && <div className={classes.error}>{error}</div>}
<div className={classes.icon}>
{!!progress && (
<div
className={classes.progress}
- style={{ top: (progress * 100) + '%' }}/>
+ style={{ top: progress * 100 + '%' }}
+ />
)}
- <div className={classes.extension}>
- {extension(file)}
- </div>
+ <div className={classes.extension}>{extension(file)}</div>
</div>
<div className={classes.name}>{file.name}</div>
diff --git a/src/atoms/ValidatedField.js b/src/atoms/ValidatedField.js
index c878ac5c94bdd93bbf785b5f48b341416f313619..379accfcf98dbe0dbf5613f9bf08deadcdb4b875 100644
--- a/src/atoms/ValidatedField.js
+++ b/src/atoms/ValidatedField.js
@@ -10,30 +10,31 @@ const ValidatedFieldComponent = ({ component }) => ({ meta, input }) => (
<div>
{component(input)}
- {meta.touched && (meta.error || meta.warning) && (
- <div className={classes.messages}>
- {meta.error && (
- <div className={classnames(classes.message, classes.error)}>
- {meta.error}
- </div>
- )}
+ {meta.touched &&
+ (meta.error || meta.warning) && (
+ <div className={classes.messages}>
+ {meta.error && (
+ <div className={classnames(classes.message, classes.error)}>
+ {meta.error}
+ </div>
+ )}
- {meta.warning && (
- <div className={classnames(classes.message, classes.warning)}>
- {meta.warning}
- </div>
- )}
- </div>
- )}
+ {meta.warning && (
+ <div className={classnames(classes.message, classes.warning)}>
+ {meta.warning}
+ </div>
+ )}
+ </div>
+ )}
</div>
)
const ValidatedField = ({ fieldComponent, ...rest }) => (
- <Field {...rest} component={fieldComponent}/>
+ <Field {...rest} component={fieldComponent} />
)
export default compose(
withHandlers({
- fieldComponent: ValidatedFieldComponent
- })
+ fieldComponent: ValidatedFieldComponent,
+ }),
)(ValidatedField)
diff --git a/src/molecules/AppBar.js b/src/molecules/AppBar.js
index 4af63917e70389548e029c0d42166b5329bdbf30..de2fdba767d827d7591c23e236b5fa611bf3b790 100644
--- a/src/molecules/AppBar.js
+++ b/src/molecules/AppBar.js
@@ -6,8 +6,12 @@ import Icon from '../atoms/Icon'
const AppBar = ({ brandLink, brandName, loginLink, logoutLink, userName }) => (
<div className={classes.root}>
- <Link to={brandLink || '/'}
- className={classnames(classes.link, classes.logo)}>{brandName}</Link>
+ <Link
+ to={brandLink || '/'}
+ className={classnames(classes.link, classes.logo)}
+ >
+ {brandName}
+ </Link>
<div>
{userName && (
@@ -18,11 +22,16 @@ const AppBar = ({ brandLink, brandName, loginLink, logoutLink, userName }) => (
)}
{userName ? (
- <Link to={logoutLink}
- className={classnames(classes.item, classes.link)}>logout</Link>
+ <Link
+ to={logoutLink}
+ className={classnames(classes.item, classes.link)}
+ >
+ logout
+ </Link>
) : (
- <Link to={loginLink}
- className={classnames(classes.item, classes.link)}>login</Link>
+ <Link to={loginLink} className={classnames(classes.item, classes.link)}>
+ login
+ </Link>
)}
</div>
</div>
diff --git a/src/molecules/Attachments.js b/src/molecules/Attachments.js
index 6cf132182cd655c4b0d3d9e38d828347921b8755..c16835a75ffd1c6d72e141915c278220bd925ff0 100644
--- a/src/molecules/Attachments.js
+++ b/src/molecules/Attachments.js
@@ -15,14 +15,10 @@ const Attachments = props => (
<span className={classes.icon}>
<Icon color="var(--color-primary)">paperclip</Icon>
</span>
- <span className={classes.filename}>
- {error ? error : 'Uploading…'}
- </span>
+ <span className={classes.filename}>{error ? error : 'Uploading…'}</span>
</div>
)}
- uploadedFile={value => (
- <Attachment key={value.url} value={value}/>
- )}
+ uploadedFile={value => <Attachment key={value.url} value={value} />}
/>
)
diff --git a/src/molecules/Files.js b/src/molecules/Files.js
index 329119ae8d5ef8dabbad56e6cbded57cc62dab18..ed71b40748b3afd976afba45000626ae70bfeed2 100644
--- a/src/molecules/Files.js
+++ b/src/molecules/Files.js
@@ -3,12 +3,12 @@ import classes from './Files.local.scss'
import Upload from './Upload'
class Files extends React.Component {
- constructor (props) {
+ constructor(props) {
super(props)
this.state = {
values: props.value || [],
- uploads: []
+ uploads: [],
}
}
@@ -22,7 +22,7 @@ class Files extends React.Component {
Array.from(event.target.files).forEach(file => {
uploads.push({
file,
- request: this.props.uploadFile(file)
+ request: this.props.uploadFile(file),
})
})
@@ -32,7 +32,7 @@ class Files extends React.Component {
handleUploadedFile = ({ file, url }) => {
const values = this.state.values.concat({
name: file.name,
- url
+ url,
})
const uploads = this.state.uploads.filter(item => {
@@ -44,7 +44,7 @@ class Files extends React.Component {
this.props.onChange(values)
}
- render () {
+ render() {
const { name, buttonText, uploadingFile, uploadedFile } = this.props
const { values, uploads } = this.state
@@ -54,7 +54,8 @@ class Files extends React.Component {
<button
type="button"
className={classes.attach}
- onClick={() => this.fileInput.click()}>
+ onClick={() => this.fileInput.click()}
+ >
{buttonText}
</button>
@@ -64,19 +65,21 @@ class Files extends React.Component {
type="file"
name={name}
multiple
- onChange={this.handleChange}/>
+ onChange={this.handleChange}
+ />
</div>
<div className={classes.files}>
- {uploads && uploads.map(upload => (
- <Upload
- key={upload.file.name}
- file={upload.file}
- request={upload.request}
- handleUploadedFile={this.handleUploadedFile}
- render={uploadingFile}
- />
- ))}
+ {uploads &&
+ uploads.map(upload => (
+ <Upload
+ key={upload.file.name}
+ file={upload.file}
+ request={upload.request}
+ handleUploadedFile={this.handleUploadedFile}
+ render={uploadingFile}
+ />
+ ))}
{values && values.map(uploadedFile)}
</div>
diff --git a/src/molecules/PlainButton.js b/src/molecules/PlainButton.js
index 741e65c02a928e7c7a32eca4e6eea93d6f2b84db..98d80d9d00d9f34054459bdebb4ee0d9595a46f6 100644
--- a/src/molecules/PlainButton.js
+++ b/src/molecules/PlainButton.js
@@ -3,14 +3,23 @@ import classnames from 'classnames'
import Button from '../atoms/Button'
import classes from './PlainButton.local.scss'
-const PlainButton = ({ className, children, type, disabled, primary, onClick }) => (
+const PlainButton = ({
+ className,
+ children,
+ type,
+ disabled,
+ primary,
+ onClick,
+}) => (
<Button
className={classnames(classes.root, className)}
type={type}
primary={primary}
disabled={disabled}
- onClick={onClick}>{children}</Button>
+ onClick={onClick}
+ >
+ {children}
+ </Button>
)
export default PlainButton
-
diff --git a/src/molecules/RadioGroup.js b/src/molecules/RadioGroup.js
index a6a5eb6f3ac6c1174a426174ee7a6d2be5a9a1f9..ecc19952f6931668e4c877b4ce152b9f45654bc9 100644
--- a/src/molecules/RadioGroup.js
+++ b/src/molecules/RadioGroup.js
@@ -2,11 +2,11 @@ import React from 'react'
import Radio from '../atoms/Radio'
class RadioGroup extends React.Component {
- constructor (props) {
+ constructor(props) {
super(props)
this.state = {
- value: props.value
+ value: props.value,
}
}
@@ -18,7 +18,7 @@ class RadioGroup extends React.Component {
this.props.onChange(value)
}
- render () {
+ render() {
const { inline, name, options, required } = this.props
const { value } = this.state
@@ -34,7 +34,8 @@ class RadioGroup extends React.Component {
label={option.label}
color={option.color}
checked={option.value === value}
- onChange={this.handleChange}/>
+ onChange={this.handleChange}
+ />
))}
</div>
)
diff --git a/src/molecules/Supplementary.js b/src/molecules/Supplementary.js
index 6a20b5aafc681899b37850f17bcb7647f929de51..f10a743024e626f50047eaf911a7af080699c19b 100644
--- a/src/molecules/Supplementary.js
+++ b/src/molecules/Supplementary.js
@@ -12,13 +12,11 @@ const Supplementary = props => (
key={file.name}
file={file}
progress={progress}
- error={error}/>
+ error={error}
+ />
)}
- uploadedFile={value => (
- <File
- key={value.url}
- value={value}/>
- )}/>
+ uploadedFile={value => <File key={value.url} value={value} />}
+ />
)
export default Supplementary
diff --git a/src/molecules/Upload.js b/src/molecules/Upload.js
index 8241fa4038f5286da249b9fa2d7288e6878de951..b18c1332e665e77dd14ba21f00218a4b5371bae3 100644
--- a/src/molecules/Upload.js
+++ b/src/molecules/Upload.js
@@ -9,7 +9,7 @@ class Upload extends React.Component {
error: undefined,
}
- componentDidMount () {
+ componentDidMount() {
const { request } = this.props
request.addEventListener('progress', this.handleProgress)
@@ -23,40 +23,40 @@ class Upload extends React.Component {
if (!event.lengthComputable) return
this.setState({
- progress: event.loaded / event.total
+ progress: event.loaded / event.total,
})
}
handleLoad = event => {
if (this.props.request.status === 200) {
this.setState({
- progress: 1
+ progress: 1,
})
this.props.handleUploadedFile({
file: this.props.file,
- url: this.props.request.responseText
+ url: this.props.request.responseText,
})
} else {
this.setState({
- error: 'There was an error'
+ error: 'There was an error',
})
}
}
handleError = event => {
this.setState({
- error: 'There was an error'
+ error: 'There was an error',
})
}
handleAbort = event => {
this.setState({
- error: 'The upload was cancelled'
+ error: 'The upload was cancelled',
})
}
- render () {
+ render() {
const { file, render } = this.props
const { progress, error } = this.state
diff --git a/src/molecules/YesOrNo.js b/src/molecules/YesOrNo.js
index 1d16de39d3910f7f9f311eb68124fe044cd630e7..2ed90122e63528b7c12e21bbc8b2310cfb1f73f7 100644
--- a/src/molecules/YesOrNo.js
+++ b/src/molecules/YesOrNo.js
@@ -5,12 +5,12 @@ import classes from './YesOrNo.local.scss'
const options = [
{
value: 'yes',
- label: 'Yes'
+ label: 'Yes',
},
{
value: 'no',
- label: 'No'
- }
+ label: 'No',
+ },
]
const YesOrNo = ({ name, value, required, onChange }) => (
@@ -21,7 +21,8 @@ const YesOrNo = ({ name, value, required, onChange }) => (
value={value}
required={required}
inline={true}
- onChange={onChange}/>
+ onChange={onChange}
+ />
)
export default YesOrNo
diff --git a/styleguide.config.js b/styleguide.config.js
index 18efe3b1dd8b1856882cd945a5d694b4748aa527..83a1f4cb1054a3446eeae26f276f5f10149739fe 100644
--- a/styleguide.config.js
+++ b/styleguide.config.js
@@ -1,8 +1,10 @@
module.exports = {
title: 'xpub-ui style guide',
styleguideComponents: {
- StyleGuideRenderer: require.resolve('xpub-styleguide/src/components/StyleGuideRenderer'),
- Wrapper: require.resolve('xpub-styleguide/src/components/Wrapper')
+ StyleGuideRenderer: require.resolve(
+ 'xpub-styleguide/src/components/StyleGuideRenderer',
+ ),
+ Wrapper: require.resolve('xpub-styleguide/src/components/Wrapper'),
},
context: {
faker: 'faker',
@@ -10,28 +12,28 @@ module.exports = {
skipComponentsWithoutExample: true,
theme: {
fontFamily: {
- base: '"Fira Sans", sans-serif'
+ base: '"Fira Sans", sans-serif',
},
color: {
- link: 'cornflowerblue'
- }
+ link: 'cornflowerblue',
+ },
},
sections: [
{
name: 'Colors',
- content: 'docs/colors.md'
+ content: 'docs/colors.md',
},
{
name: 'Fonts',
- content: 'docs/fonts.md'
+ content: 'docs/fonts.md',
},
{
name: 'Atoms',
- components: 'src/atoms/*.js'
+ components: 'src/atoms/*.js',
},
{
name: 'Molecules',
- components: 'src/molecules/*.js'
- }
- ]
+ components: 'src/molecules/*.js',
+ },
+ ],
}
diff --git a/test/AppBar.test.js b/test/AppBar.test.js
index 9a94b13fc8f8948367fbf16a708f59b0d91eb96a..5c2bb6f43b1508c3345e0440da008c42c0f8b6cd 100644
--- a/test/AppBar.test.js
+++ b/test/AppBar.test.js
@@ -1,7 +1,7 @@
import React from 'react'
import { clone } from 'lodash'
import { shallow } from 'enzyme'
-import {Link, MemoryRouter} from 'react-router-dom'
+import { Link, MemoryRouter } from 'react-router-dom'
import renderer from 'react-test-renderer'
import AppBar from '../src/molecules/AppBar'
@@ -16,24 +16,28 @@ const props = {
function makeWrapper(extraProps = {}) {
return shallow(
- <MemoryRouter>
- <AppBar {...props} {...extraProps}/>
- </MemoryRouter>
- ).dive().dive()
+ <MemoryRouter>
+ <AppBar {...props} {...extraProps} />
+ </MemoryRouter>,
+ )
+ .dive()
+ .dive()
}
describe('AppBar', () => {
test('Snapshot', () => {
- const tree = renderer.create(
+ const tree = renderer
+ .create(
<MemoryRouter>
<AppBar {...props} />
- </MemoryRouter>
- ).toJSON()
+ </MemoryRouter>,
+ )
+ .toJSON()
expect(tree).toMatchSnapshot()
})
test("Should link the brand to '/' if no brand link is given", () => {
- const wrapper = makeWrapper({brandLink: undefined})
+ const wrapper = makeWrapper({ brandLink: undefined })
const brand = wrapper.childAt(0)
expect(brand.prop('to')).toBe('/')
@@ -54,7 +58,7 @@ describe('AppBar', () => {
})
test('Should not display the username if there is none given', () => {
- const wrapper = makeWrapper({userName: undefined})
+ const wrapper = makeWrapper({ userName: undefined })
const rightArea = wrapper.childAt(1)
@@ -68,14 +72,14 @@ describe('AppBar', () => {
expect(rightArea.children()).toHaveLength(2)
const userName = rightArea.childAt(0)
- expect(userName.text()).toBe("<Icon />some name")
+ expect(userName.text()).toBe('<Icon />some name')
})
test('Should display the login link if no username is given', () => {
- const wrapper = makeWrapper({userName: undefined})
+ const wrapper = makeWrapper({ userName: undefined })
const rightArea = wrapper.childAt(1)
- const logLink = rightArea.childAt(0) // first el if there is no username
+ const logLink = rightArea.childAt(0) // first el if there is no username
expect(logLink.is(Link)).toBeTruthy()
expect(logLink.prop('to')).toBe(props.loginLink)
diff --git a/test/Menu.test.js b/test/Menu.test.js
index 536d756318a417ddb9d735a7a02d3879165cd425..9070d25160672016ef72d8e2e000d89b11ea4a99 100644
--- a/test/Menu.test.js
+++ b/test/Menu.test.js
@@ -5,20 +5,15 @@ import renderer from 'react-test-renderer'
import Menu from '../src/atoms/Menu'
const props = {
- options: [
- { value: 'foo', label: 'Foo' },
- { value: 'bar', label: 'Bar' },
- ],
- value: 'foo'
+ options: [{ value: 'foo', label: 'Foo' }, { value: 'bar', label: 'Bar' }],
+ value: 'foo',
}
const wrapper = shallow(<Menu {...props} />)
describe('Menu', () => {
test('Snapshot', () => {
- const tree = renderer.create(
- <Menu {...props} />
- ).toJSON()
+ const tree = renderer.create(<Menu {...props} />).toJSON()
expect(tree).toMatchSnapshot()
})
diff --git a/test/Radio.test.js b/test/Radio.test.js
index cadded1ba8caad7c98172b80bc5483077b591128..35d3309950474493fef25b8ca1ab14dc0d792ab6 100644
--- a/test/Radio.test.js
+++ b/test/Radio.test.js
@@ -9,16 +9,14 @@ const props = {
label: 'TestLabel',
name: 'TestName',
required: true,
- value: 'TestValue'
+ value: 'TestValue',
}
const wrapper = shallow(<Radio {...props} />)
describe('Radio', () => {
test('Snapshot', () => {
- const tree = renderer.create(
- <Radio {...props} />
- ).toJSON()
+ const tree = renderer.create(<Radio {...props} />).toJSON()
expect(tree).toMatchSnapshot()
})
diff --git a/test/RadioGroup.test.js b/test/RadioGroup.test.js
index be8884cadb14a40a03f7f83122389816e58c5512..069b09f2ae726a35d3fa6ab3d96474863a87620c 100644
--- a/test/RadioGroup.test.js
+++ b/test/RadioGroup.test.js
@@ -11,19 +11,19 @@ const props = {
options: [
{
label: 'Yes',
- value: 'yes'
+ value: 'yes',
},
{
label: 'No',
- value: 'no'
+ value: 'no',
},
{
label: 'Maybe',
- value: 'maybe'
- }
+ value: 'maybe',
+ },
],
required: true,
- value: undefined
+ value: undefined,
}
const wrapper = shallow(<RadioGroup {...props} />)
@@ -31,9 +31,7 @@ const radios = wrapper.find(Radio)
describe('Radio Group', () => {
test('Snapshot', () => {
- const tree = renderer.create(
- <RadioGroup {...props} />
- ).toJSON()
+ const tree = renderer.create(<RadioGroup {...props} />).toJSON()
expect(tree).toMatchSnapshot()
})
diff --git a/test/YesOrNo.test.js b/test/YesOrNo.test.js
index d2256b133df002ceb0e73f5015b9f7dc1169089b..f8de3f7c72042fae52ca02c794553405d14e8ca2 100644
--- a/test/YesOrNo.test.js
+++ b/test/YesOrNo.test.js
@@ -7,7 +7,7 @@ import RadioGroup from '../src/molecules/RadioGroup'
const props = {
name: 'TestName',
- value: 'Maybe'
+ value: 'Maybe',
}
const wrapper = shallow(<YesOrNo {...props} />)
@@ -15,9 +15,7 @@ const radio = wrapper.find(RadioGroup)
describe('Yes or No', () => {
test('Snapshot', () => {
- const tree = renderer.create(
- <YesOrNo {...props} />
- ).toJSON()
+ const tree = renderer.create(<YesOrNo {...props} />).toJSON()
expect(tree).toMatchSnapshot()
})
diff --git a/test/config/transform.js b/test/config/transform.js
index 4fc948d1f24c1712a09c22c86b55d1992533ae4e..7cc533c7f6c6251ce1b71bb5171ee6ef28991c4d 100644
--- a/test/config/transform.js
+++ b/test/config/transform.js
@@ -1,7 +1,3 @@
module.exports = require('babel-jest').createTransformer({
- presets: [
- 'env',
- 'react',
- 'stage-2'
- ]
-});
+ presets: ['env', 'react', 'stage-2'],
+})
diff --git a/test/setup/enzyme.js b/test/setup/enzyme.js
index feb8347d96b58c50b631f3fa8f72bf7d882bdba9..7ae191afcbbe1d62f2497f8634fcfe952bb6b520 100644
--- a/test/setup/enzyme.js
+++ b/test/setup/enzyme.js
@@ -1,4 +1,4 @@
import Enzyme from 'enzyme'
import Adapter from 'enzyme-adapter-react-15'
-Enzyme.configure({adapter: new Adapter()})
\ No newline at end of file
+Enzyme.configure({ adapter: new Adapter() })