Skip to content

Commit 1ed18c1

Browse files
mathieuancelinmathieuancelin
committed
Format code using prettier
1 parent 3f6f263 commit 1ed18c1

12 files changed

+163
-87
lines changed

‎package.json

+3-1
Original file line numberDiff line numberDiff line change
@@ -9,6 +9,7 @@
99
"dependencies": {
1010
"es-symbol": "1.1.2",
1111
"es6-shim": "0.35.3",
12+
"prettier": "1.7.4",
1213
"react": "16.0.0",
1314
"react-dom": "16.0.0",
1415
"react-router": "3.0.5",
@@ -18,6 +19,7 @@
1819
"start": "react-scripts start",
1920
"build": "react-scripts build",
2021
"test": "react-scripts test --env=jsdom",
21-
"eject": "react-scripts eject"
22+
"eject": "react-scripts eject",
23+
"prettier": "prettier --write --single-quote --trailing-comma es5 --print-width 100 --tab-width 2 --jsx-bracket-same-line \"src/**/*.js\""
2224
}
2325
}

‎src/components/Comment.js

+5-2
Original file line numberDiff line numberDiff line change
@@ -4,8 +4,11 @@ import './Comment.css';
44
export class Comment extends Component {
55
render() {
66
return (
7-
<p className="comment" data-title={this.props.comment.title} data-date={this.props.comment.date}>
8-
{this.props.comment.content}
7+
<p
8+
className="comment"
9+
data-title={this.props.comment.title}
10+
data-date={this.props.comment.date}>
11+
{this.props.comment.content}
912
</p>
1013
);
1114
}

‎src/components/CommentList.js

+4-4
Original file line numberDiff line numberDiff line change
@@ -3,10 +3,9 @@ import { Comment, Loader } from '.';
33
import * as WinesService from '../services/Wines';
44

55
export class CommentList extends Component {
6-
76
state = {
87
loading: false,
9-
comments: []
8+
comments: [],
109
};
1110

1211
componentDidMount() {
@@ -25,14 +24,15 @@ export class CommentList extends Component {
2524
this.setState({ comments, loading: false });
2625
});
2726
});
28-
}
27+
};
2928

3029
render() {
3130
return (
3231
<div>
3332
{this.state.comments.length > 0 && <h5>Comments</h5>}
3433
{this.state.loading && <Loader />}
35-
{!this.state.loading && this.state.comments.map(comment => <Comment key={comment.date} comment={comment} />)}
34+
{!this.state.loading &&
35+
this.state.comments.map(comment => <Comment key={comment.date} comment={comment} />)}
3636
</div>
3737
);
3838
}

‎src/components/CommentModal.js

+26-11
Original file line numberDiff line numberDiff line change
@@ -2,9 +2,8 @@ import React, { Component } from 'react';
22
import * as WinesService from '../services/Wines';
33

44
export class CommentModal extends Component {
5-
65
state = {
7-
comment: ''
6+
comment: '',
87
};
98

109
componentDidMount() {
@@ -28,36 +27,52 @@ export class CommentModal extends Component {
2827
window.$(this.modalNode).closeModal();
2928
}
3029

31-
onSubmit = (e) => {
30+
onSubmit = e => {
3231
e.preventDefault();
3332
const comment = this.state.comment;
3433
this.setState({ comment: '' });
3534
WinesService.commentWine(this.props.wine.id, comment).then(() => {
3635
this.props.closeCommentModal();
3736
});
38-
}
37+
};
3938

40-
onCommentChange = (e) => {
39+
onCommentChange = e => {
4140
this.setState({ comment: e.target.value });
42-
}
43-
41+
};
42+
4443
render() {
4544
return (
46-
<div ref={ref => this.modalNode = ref} className="modal">
45+
<div ref={ref => (this.modalNode = ref)} className="modal">
4746
<div className="modal-content">
4847
<h4>Tell us something about this wine</h4>
4948
<form className="col s12">
5049
<div className="row">
5150
<div className="input-field col s12">
52-
<input id="inputComment" type="text" className="validate" value={this.state.comment} onChange={this.onCommentChange} />
51+
<input
52+
id="inputComment"
53+
type="text"
54+
className="validate"
55+
value={this.state.comment}
56+
onChange={this.onCommentChange}
57+
/>
5358
<label htmlFor="inputComment">Your comment</label>
5459
</div>
5560
</div>
5661
</form>
5762
</div>
5863
<div className="modal-footer">
59-
<a href="#!" className="modal-action waves-effect waves-green btn-flat " onClick={this.onSubmit}>Submit</a>
60-
<a href="#!" className="modal-action waves-effect waves-green btn-flat " onClick={this.props.closeCommentModal}>Cancel</a>
64+
<a
65+
href="#!"
66+
className="modal-action waves-effect waves-green btn-flat "
67+
onClick={this.onSubmit}>
68+
Submit
69+
</a>
70+
<a
71+
href="#!"
72+
className="modal-action waves-effect waves-green btn-flat "
73+
onClick={this.props.closeCommentModal}>
74+
Cancel
75+
</a>
6176
</div>
6277
</div>
6378
);

‎src/components/LikeButton.js

+16-9
Original file line numberDiff line numberDiff line change
@@ -3,10 +3,9 @@ import { Loader } from '.';
33
import * as WinesService from '../services/Wines';
44

55
export class LikeButton extends Component {
6-
76
state = {
87
loading: false,
9-
liked: null
8+
liked: null,
109
};
1110

1211
componentDidMount() {
@@ -25,9 +24,9 @@ export class LikeButton extends Component {
2524
this.setState({ liked: liked.like, loading: false });
2625
});
2726
});
28-
}
27+
};
2928

30-
toggle = (e) => {
29+
toggle = e => {
3130
e.preventDefault();
3231
if (this.state.liked) {
3332
this.setState({ liked: !this.state.liked }, () => {
@@ -38,14 +37,22 @@ export class LikeButton extends Component {
3837
WinesService.likeWine(this.props.wine.id).then(() => this.updateLike());
3938
});
4039
}
41-
}
42-
40+
};
41+
4342
render() {
4443
return (
4544
<a className="waves-effect waves-teal btn-flat" onClick={this.toggle}>
46-
{this.state.loading && (<Loader />)}
47-
{this.state.liked === true && (<span>Unlike <i className="material-icons left">thumb_down</i></span>)}
48-
{this.state.liked === false && (<span>Like <i className="material-icons left">thumb_up</i></span>)}
45+
{this.state.loading && <Loader />}
46+
{this.state.liked === true && (
47+
<span>
48+
Unlike <i className="material-icons left">thumb_down</i>
49+
</span>
50+
)}
51+
{this.state.liked === false && (
52+
<span>
53+
Like <i className="material-icons left">thumb_up</i>
54+
</span>
55+
)}
4956
</a>
5057
);
5158
}

‎src/components/Loader.js

+24-7
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,8 @@
11
import React, { Component } from 'react';
22

33
export class Loader extends Component {
4-
54
state = {
6-
bigDot: 0
5+
bigDot: 0,
76
};
87

98
next = () => {
@@ -19,7 +18,7 @@ export class Loader extends Component {
1918
this.timeout = setTimeout(this.next, 200);
2019
});
2120
}
22-
}
21+
};
2322

2423
componentDidMount() {
2524
this.mounted = true;
@@ -30,13 +29,31 @@ export class Loader extends Component {
3029
this.mounted = false;
3130
clearTimeout(this.timeout);
3231
}
33-
32+
3433
render() {
3534
return (
3635
<div style={{ color: 'black' }}>
37-
<span style={{ fontSize: this.state.bigDot === 0 ? 16 : 12, fontWeight: this.state.bigDot === 0 ? 'bold' : 'normal' }}>{'.'}</span>
38-
<span style={{ fontSize: this.state.bigDot === 1 ? 16 : 12, fontWeight: this.state.bigDot === 1 ? 'bold' : 'normal' }}>{'.'}</span>
39-
<span style={{ fontSize: this.state.bigDot === 2 ? 16 : 12, fontWeight: this.state.bigDot === 2 ? 'bold' : 'normal' }}>{'.'}</span>
36+
<span
37+
style={{
38+
fontSize: this.state.bigDot === 0 ? 16 : 12,
39+
fontWeight: this.state.bigDot === 0 ? 'bold' : 'normal',
40+
}}>
41+
{'.'}
42+
</span>
43+
<span
44+
style={{
45+
fontSize: this.state.bigDot === 1 ? 16 : 12,
46+
fontWeight: this.state.bigDot === 1 ? 'bold' : 'normal',
47+
}}>
48+
{'.'}
49+
</span>
50+
<span
51+
style={{
52+
fontSize: this.state.bigDot === 2 ? 16 : 12,
53+
fontWeight: this.state.bigDot === 2 ? 'bold' : 'normal',
54+
}}>
55+
{'.'}
56+
</span>
4057
</div>
4158
);
4259
}

‎src/components/Regions.js

+9-7
Original file line numberDiff line numberDiff line change
@@ -1,25 +1,27 @@
11
import React, { Component } from 'react';
22

33
export class Regions extends Component {
4-
54
onSelectRegion = (e, region) => {
65
e.preventDefault();
76
this.props.onSelectRegion(region);
8-
}
7+
};
98

109
render() {
1110
return (
1211
<div className="col s12 m6 l3">
1312
<h2 className="center-align">Regions</h2>
1413
<div className="collection">
15-
{this.props.regions.map(region =>
16-
<a key={region}
14+
{this.props.regions.map(region => (
15+
<a
16+
key={region}
1717
href="#!"
1818
onClick={e => this.onSelectRegion(e, region)}
19-
className={['collection-item', region === this.props.region ? 'active' : ''].join(' ')}>
20-
{region}
19+
className={['collection-item', region === this.props.region ? 'active' : ''].join(
20+
' '
21+
)}>
22+
{region}
2123
</a>
22-
)}
24+
))}
2325
</div>
2426
</div>
2527
);

‎src/components/Wine.js

+19-7
Original file line numberDiff line numberDiff line change
@@ -11,21 +11,33 @@ export class Wine extends Component {
1111
<h2 className="center-align">Wine details</h2>
1212
<div className="card horizontal">
1313
<div className="card-image">
14-
<img className="responsive-img wine-detail-image" alt="Wine bottle pic" src={`${this.props.host}/api/wines/${this.props.wine.id}/image`} />
14+
<img
15+
className="responsive-img wine-detail-image"
16+
alt="Wine bottle pic"
17+
src={`${this.props.host}/api/wines/${this.props.wine.id}/image`}
18+
/>
1519
</div>
1620
<div className="card-stacked">
1721
<div className="card-content">
1822
<h3>{this.props.wine.name}</h3>
19-
<br/>
20-
<p><b>Appellation:</b> {this.props.wine.appellation.name}</p>
21-
<p><b>Region:</b> {this.props.wine.appellation.region}</p>
22-
<p><b>Color:</b> {this.props.wine.type}</p>
23-
<p><b>Grapes:</b> {this.props.wine.grapes.join(', ')}</p>
23+
<br />
24+
<p>
25+
<b>Appellation:</b> {this.props.wine.appellation.name}
26+
</p>
27+
<p>
28+
<b>Region:</b> {this.props.wine.appellation.region}
29+
</p>
30+
<p>
31+
<b>Color:</b> {this.props.wine.type}
32+
</p>
33+
<p>
34+
<b>Grapes:</b> {this.props.wine.grapes.join(', ')}
35+
</p>
2436
<CommentList wine={this.props.wine} />
2537
</div>
2638
<div className="card-action">
2739
<LikeButton wine={this.props.wine} />
28-
<CommentButton openCommentModal={this.props.openCommentModal} />
40+
<CommentButton openCommentModal={this.props.openCommentModal} />
2941
</div>
3042
</div>
3143
</div>

0 commit comments

Comments
 (0)