Skip to content

Commit d4971cf

Browse files
rcdextarcdexta
committed
Add prettier and eslint along with rules
2 parents 5716552 + e52df12 commit d4971cf

22 files changed

Lines changed: 537 additions & 394 deletions

‎.eslintrc‎

Lines changed: 14 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -3,11 +3,22 @@
33
"rules": {
44
"strict": 0,
55
"no-fallthrough": 0,
6-
"react/prop-types": 0
6+
"react/prop-types": 0,
7+
"prettier/prettier": ["error", {
8+
"printWidth": 120,
9+
"singleQuote": true,
10+
"trailingComma": "none",
11+
"bracketSpacing": false,
12+
"jsxBracketSameLine": true,
13+
"arrowParens": "avoid",
14+
"semi": false,
15+
"tabWidth": 2,
16+
"useTabs": false
17+
}]
718
},
8-
"extends": ["standard", "standard-react"],
19+
"extends": ["standard", "standard-react", "plugin:prettier/recommended"],
920
"env": {
1021
"browser": true,
1122
"node": true
1223
}
13-
}
24+
}

‎package.json‎

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -63,11 +63,13 @@
6363
"css-loader": "^0.28.4",
6464
"cz-conventional-changelog": "^2.0.0",
6565
"enzyme": "^2.8.2",
66-
"eslint": "^3.19.0",
66+
"eslint": "^4.14.0",
67+
"eslint-config-prettier": "^2.9.0",
6768
"eslint-config-standard": "^10.2.1",
6869
"eslint-config-standard-react": "^5.0.0",
6970
"eslint-plugin-import": "^2.3.0",
7071
"eslint-plugin-node": "^5.0.0",
72+
"eslint-plugin-prettier": "^2.4.0",
7173
"eslint-plugin-promise": "^3.5.0",
7274
"eslint-plugin-react": "^7.0.1",
7375
"eslint-plugin-standard": "^3.0.1",
@@ -80,6 +82,7 @@
8082
"jsdom": "^9.12.0",
8183
"mocha": "^3.4.2",
8284
"node-sass": "^4.5.3",
85+
"prettier": "1.10.2",
8386
"react": "^16.0.0",
8487
"react-addons-test-utils": "^15.5.1",
8588
"react-dom": "^16.0.0",

‎src/components/Board.js‎

Lines changed: 6 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -9,9 +9,11 @@ const middlewares = process.env.NODE_ENV === 'development' ? [logger] : []
99
const store = createStore(boardReducer, applyMiddleware(...middlewares))
1010

1111
export default class Board extends Component {
12-
render () {
13-
return <Provider store={store}>
14-
<BoardContainer {...this.props} />
15-
</Provider>
12+
render() {
13+
return (
14+
<Provider store={store}>
15+
<BoardContainer {...this.props} />
16+
</Provider>
17+
)
1618
}
1719
}

‎src/components/BoardContainer.js‎

Lines changed: 7 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -51,7 +51,13 @@ class BoardContainer extends Component {
5151

5252
onDragEnd = result => {
5353
const {source, destination, draggableId} = result
54-
destination && this.props.actions.moveCardAcrossLanes({fromLaneId: source.droppableId, toLaneId: destination.droppableId, cardId: draggableId, index: destination.index})
54+
destination &&
55+
this.props.actions.moveCardAcrossLanes({
56+
fromLaneId: source.droppableId,
57+
toLaneId: destination.droppableId,
58+
cardId: draggableId,
59+
index: destination.index
60+
})
5561
}
5662

5763
render() {

‎src/components/Lane.js‎

Lines changed: 46 additions & 28 deletions
Original file line numberDiff line numberDiff line change
@@ -3,15 +3,16 @@ import Loader from './Loader'
33
import PropTypes from 'prop-types'
44
import Card from './Card'
55
import {
6-
Section,
7-
Header,
8-
Title,
9-
RightContent,
10-
DraggableList,
11-
Placeholder,
12-
AddCardLink,
13-
LaneWrapper, ScrollableLane,
14-
} from '../styles/Base';
6+
Section,
7+
Header,
8+
Title,
9+
RightContent,
10+
DraggableList,
11+
Placeholder,
12+
AddCardLink,
13+
LaneWrapper,
14+
ScrollableLane
15+
} from '../styles/Base'
1516
import {bindActionCreators} from 'redux'
1617
import {connect} from 'react-redux'
1718
import update from 'immutability-helper'
@@ -44,7 +45,11 @@ class Lane extends Component {
4445
// if no cards present, stop retrying until user action
4546
node.scrollTop = node.scrollTop - 50
4647
} else {
47-
this.props.actions.paginateLane({laneId: this.props.id, newCards: moreCards, nextPage: nextPage})
48+
this.props.actions.paginateLane({
49+
laneId: this.props.id,
50+
newCards: moreCards,
51+
nextPage: nextPage
52+
})
4853
}
4954
this.setState({loading: false})
5055
})
@@ -62,7 +67,7 @@ class Lane extends Component {
6267
laneDidMount = (node, dragReference) => {
6368
if (node) {
6469
node.addEventListener('scroll', this.handleScroll)
65-
dragReference(node)
70+
dragReference(node)
6671
}
6772
}
6873

@@ -81,12 +86,20 @@ class Lane extends Component {
8186

8287
componentWillReceiveProps(nextProps) {
8388
if (!isEqual(this.props.cards, nextProps.cards)) {
84-
this.setState({cards: nextProps.cards, currentPage: nextProps.currentPage})
89+
this.setState({
90+
cards: nextProps.cards,
91+
currentPage: nextProps.currentPage
92+
})
8593
}
8694
}
8795

8896
moveCardAcrossLanes = (fromLaneId, toLaneId, cardId) => {
89-
toLaneId && this.props.actions.moveCardAcrossLanes({fromLaneId: fromLaneId, toLaneId: toLaneId, cardId: cardId})
97+
toLaneId &&
98+
this.props.actions.moveCardAcrossLanes({
99+
fromLaneId: fromLaneId,
100+
toLaneId: toLaneId,
101+
cardId: cardId
102+
})
90103
}
91104

92105
removeCard = (laneId, cardId) => {
@@ -185,10 +198,11 @@ class Lane extends Component {
185198
return (
186199
<Header>
187200
<Title style={titleStyle}>{title}</Title>
188-
{label &&
201+
{label && (
189202
<RightContent>
190203
<span style={labelStyle}>{label}</span>
191-
</RightContent>}
204+
</RightContent>
205+
)}
192206
</Header>
193207
)
194208
}
@@ -202,18 +216,20 @@ class Lane extends Component {
202216
<Droppable droppableId={id} type="card" index={index} isDropDisabled={isDropDisabled}>
203217
{(dropProvided, dropSnapshot) => {
204218
const isDraggingOver = dropSnapshot.isDraggingOver
205-
return <Section
206-
{...otherProps}
207-
key={id}
208-
onClick={() => onLaneClick && onLaneClick(id)}
209-
innerRef={ref => this.laneDidMount(ref, dropProvided.innerRef)}
210-
isDraggingOver={isDraggingOver}
211-
{...dropProvided.draggableProps}>
212-
{this.renderHeader()}
213-
{this.renderDragContainer()}
214-
{loading && <Loader/>}
215-
</Section>
216-
}}
219+
return (
220+
<Section
221+
{...otherProps}
222+
key={id}
223+
onClick={() => onLaneClick && onLaneClick(id)}
224+
innerRef={ref => this.laneDidMount(ref, dropProvided.innerRef)}
225+
isDraggingOver={isDraggingOver}
226+
{...dropProvided.draggableProps}>
227+
{this.renderHeader()}
228+
{this.renderDragContainer()}
229+
{loading && <Loader />}
230+
</Section>
231+
)
232+
}}
217233
</Droppable>
218234
)
219235
}
@@ -250,6 +266,8 @@ Lane.defaultProps = {
250266
onCardAdd: () => {}
251267
}
252268

253-
const mapDispatchToProps = dispatch => ({actions: bindActionCreators(laneActions, dispatch)})
269+
const mapDispatchToProps = dispatch => ({
270+
actions: bindActionCreators(laneActions, dispatch)
271+
})
254272

255273
export default connect(null, mapDispatchToProps)(Lane)

‎src/components/NewCard.js‎

Lines changed: 22 additions & 24 deletions
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@ import React, {Component} from 'react'
22
import PropTypes from 'prop-types'
33
import {CardHeader, CardRightContent, CardTitle, CardWrapper, Detail} from '../styles/Base'
44
import EditableLabel from './widgets/EditableLabel'
5-
import {AddButton, CancelButton} from '../styles/Elements';
5+
import {AddButton, CancelButton} from '../styles/Elements'
66

77
class NewCard extends Component {
88
updateField = (field, value) => {
@@ -13,30 +13,28 @@ class NewCard extends Component {
1313
this.props.onAdd(this.state)
1414
}
1515

16-
render () {
16+
render() {
1717
const {onCancel} = this.props
18-
return <div style={{background: '#E3E3E3'}}>
19-
<CardWrapper>
20-
<CardHeader>
21-
<CardTitle>
22-
<EditableLabel placeholder='title'
23-
onChange={val => this.updateField('title', val)}
24-
autoFocus/>
25-
</CardTitle>
26-
<CardRightContent>
27-
<EditableLabel placeholder='label'
28-
onChange={val => this.updateField('label', val)}/>
29-
</CardRightContent>
30-
</CardHeader>
31-
<Detail>
32-
<EditableLabel placeholder='description'
33-
onChange={val => this.updateField('description', val)}/>
34-
</Detail>
35-
</CardWrapper>
36-
<AddButton onClick={this.handleAdd}>Add</AddButton>
37-
<CancelButton onClick={onCancel}>Cancel</CancelButton>
38-
</div>
39-
}
18+
return (
19+
<div style={{background: '#E3E3E3'}}>
20+
<CardWrapper>
21+
<CardHeader>
22+
<CardTitle>
23+
<EditableLabel placeholder="title" onChange={val => this.updateField('title', val)} autoFocus />
24+
</CardTitle>
25+
<CardRightContent>
26+
<EditableLabel placeholder="label" onChange={val => this.updateField('label', val)} />
27+
</CardRightContent>
28+
</CardHeader>
29+
<Detail>
30+
<EditableLabel placeholder="description" onChange={val => this.updateField('description', val)} />
31+
</Detail>
32+
</CardWrapper>
33+
<AddButton onClick={this.handleAdd}>Add</AddButton>
34+
<CancelButton onClick={onCancel}>Cancel</CancelButton>
35+
</div>
36+
)
37+
}
4038
}
4139

4240
NewCard.propTypes = {

‎src/components/Tag.js‎

Lines changed: 6 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -3,10 +3,14 @@ import PropTypes from 'prop-types'
33
import {TagSpan} from '../styles/Base'
44

55
export default class Tag extends Component {
6-
render () {
6+
render() {
77
const {title, color, bgcolor, tagStyle, ...otherProps} = this.props
88
const style = {color: color || 'white', backgroundColor: bgcolor || 'orange', ...tagStyle}
9-
return <TagSpan style={style} {...otherProps}>{title}</TagSpan>
9+
return (
10+
<TagSpan style={style} {...otherProps}>
11+
{title}
12+
</TagSpan>
13+
)
1014
}
1115
}
1216

‎src/components/widgets/DeleteButton.js‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
import React from 'react'
22
import {DeleteWrapper, DeleteIcon} from '../../styles/Elements'
33

4-
const DeleteButton = (props) => {
4+
const DeleteButton = props => {
55
return (
66
<DeleteWrapper {...props}>
77
<DeleteIcon />

‎src/components/widgets/EditableLabel.js‎

Lines changed: 12 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@ export default class EditableLabel extends React.Component {
55
onChange: () => {},
66
placeholder: '',
77
className: '',
8-
autoFocus: false
8+
autoFocus: false
99
}
1010

1111
state = {text: ''}
@@ -19,15 +19,15 @@ export default class EditableLabel extends React.Component {
1919
this.setState({text: text})
2020
}
2121

22-
componentDidMount(){
23-
if (this.props.autoFocus) {
24-
this.refDiv.focus()
25-
}
26-
}
22+
componentDidMount() {
23+
if (this.props.autoFocus) {
24+
this.refDiv.focus()
25+
}
26+
}
2727

2828
onBlur = () => {
29-
this.props.onChange(this.state.text)
30-
}
29+
this.props.onChange(this.state.text)
30+
}
3131

3232
onPaste = ev => {
3333
ev.preventDefault()
@@ -40,14 +40,14 @@ export default class EditableLabel extends React.Component {
4040
return `comPlainTextContentEditable ${placeholder} ${this.props.className}`
4141
}
4242

43-
render () {
43+
render() {
4444
return (
4545
<div
46-
ref={(ref) => this.refDiv = ref}
47-
contentEditable='true'
46+
ref={ref => (this.refDiv = ref)}
47+
contentEditable="true"
4848
className={this.getClassName()}
4949
onPaste={this.onPaste}
50-
onBlur={this.onBlur}
50+
onBlur={this.onBlur}
5151
onInput={this.onTextChange}
5252
placeholder={this.props.placeholder}
5353
/>

0 commit comments

Comments
 (0)