Skip to content

Commit 228f0dc

Browse files
Fix eslint (#28)
* Fix eslint running --fix * Fix eslint manually
1 parent 3a8080b commit 228f0dc

File tree

9 files changed

+52
-47
lines changed

9 files changed

+52
-47
lines changed

src/App.js

Lines changed: 5 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,11 @@ function App() {
88
<header className="App-header">
99
<img src={logo} className="App-logo" alt="logo" />
1010
<p>
11-
Edit <code>src/App.js</code> and save to reload.
11+
Edit
12+
{' '}
13+
<code>src/App.js</code>
14+
{' '}
15+
and save to reload.
1216
</p>
1317
<a
1418
className="App-link"

src/components/Marker.js

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -13,16 +13,16 @@ const Wrapper = styled.div`
1313
border-radius: 100%;
1414
user-select: none;
1515
transform: translate(-50%, -50%);
16-
cursor: ${props => (props.onClick ? 'pointer' : 'default')};
16+
cursor: ${(props) => (props.onClick ? 'pointer' : 'default')};
1717
&:hover {
1818
z-index: 1;
1919
}
2020
`;
2121

22-
const Marker = props => (
22+
const Marker = ({ text, onClick }) => (
2323
<Wrapper
24-
alt={props.text}
25-
{...props.onClick ? { onClick: props.onClick } : {}}
24+
alt={text}
25+
onClick={onClick}
2626
/>
2727
);
2828

src/examples/AutoComplete.js

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import React, { Component, Fragment } from 'react';
1+
import React, { Component } from 'react';
22
import isEmpty from 'lodash.isempty';
33

44
// components:
@@ -40,7 +40,7 @@ class Autocomplete extends Component {
4040
places, mapApiLoaded, mapInstance, mapApi,
4141
} = this.state;
4242
return (
43-
<Fragment>
43+
<>
4444
{mapApiLoaded && (
4545
<AutoComplete map={mapInstance} mapApi={mapApi} addplace={this.addPlace} />
4646
)}
@@ -54,8 +54,8 @@ class Autocomplete extends Component {
5454
yesIWantToUseGoogleMapApiInternals
5555
onGoogleApiLoaded={({ map, maps }) => this.apiHasLoaded(map, maps)}
5656
>
57-
{!isEmpty(places) &&
58-
places.map(place => (
57+
{!isEmpty(places)
58+
&& places.map((place) => (
5959
<Marker
6060
key={place.id}
6161
text={place.name}
@@ -64,7 +64,7 @@ class Autocomplete extends Component {
6464
/>
6565
))}
6666
</GoogleMap>
67-
</Fragment>
67+
</>
6868
);
6969
}
7070
}

src/examples/Heatmap.js

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import React, { Component, Fragment } from 'react';
1+
import React, { Component } from 'react';
22
import isEmpty from 'lodash.isempty';
33

44
// examples:
@@ -18,13 +18,13 @@ class Heatmap extends Component {
1818

1919
componentDidMount() {
2020
fetch('places.json')
21-
.then(response => response.json())
22-
.then(data => this.setState({ places: data.results }));
21+
.then((response) => response.json())
22+
.then((data) => this.setState({ places: data.results }));
2323
}
2424

2525
render() {
2626
const { places } = this.state;
27-
const data = places.map(place => ({
27+
const data = places.map((place) => ({
2828
lat: place.geometry.location.lat,
2929
lng: place.geometry.location.lng,
3030
weight: Math.floor(Math.random() * Math.floor(5)),
@@ -38,7 +38,7 @@ class Heatmap extends Component {
3838
};
3939

4040
return (
41-
<Fragment>
41+
<>
4242
{!isEmpty(places) && (
4343
<GoogleMap
4444
defaultZoom={10}
@@ -50,7 +50,7 @@ class Heatmap extends Component {
5050
}}
5151
/>
5252
)}
53-
</Fragment>
53+
</>
5454
);
5555
}
5656
}

src/examples/Main.js

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import React, { Component, Fragment } from 'react';
1+
import React, { Component } from 'react';
22
import isEmpty from 'lodash.isempty';
33

44
// components:
@@ -53,22 +53,22 @@ class Main extends Component {
5353

5454
componentDidMount() {
5555
fetch('places.json')
56-
.then(response => response.json())
57-
.then(data => this.setState({ places: data.results }));
56+
.then((response) => response.json())
57+
.then((data) => this.setState({ places: data.results }));
5858
}
5959

6060
render() {
6161
const { places } = this.state;
6262
return (
63-
<Fragment>
63+
<>
6464
{!isEmpty(places) && (
6565
<GoogleMap
6666
defaultZoom={10}
6767
defaultCenter={LOS_ANGELES_CENTER}
6868
yesIWantToUseGoogleMapApiInternals
6969
onGoogleApiLoaded={({ map, maps }) => apiIsLoaded(map, maps, places)}
7070
>
71-
{places.map(place => (
71+
{places.map((place) => (
7272
<Marker
7373
key={place.id}
7474
text={place.name}
@@ -78,7 +78,7 @@ class Main extends Component {
7878
))}
7979
</GoogleMap>
8080
)}
81-
</Fragment>
81+
</>
8282
);
8383
}
8484
}

src/examples/MarkerInfoWindow.js

Lines changed: 16 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import React, { Component, Fragment } from 'react';
1+
import React, { Component } from 'react';
22
import PropTypes from 'prop-types';
33
import isEmpty from 'lodash.isempty';
44

@@ -30,7 +30,8 @@ const InfoWindow = (props) => {
3030
</div>
3131
<div style={{ fontSize: 14 }}>
3232
<span style={{ color: 'grey' }}>
33-
{place.rating}{' '}
33+
{place.rating}
34+
{' '}
3435
</span>
3536
<span style={{ color: 'orange' }}>
3637
{String.fromCharCode(9733).repeat(Math.floor(place.rating))}
@@ -53,22 +54,22 @@ const InfoWindow = (props) => {
5354
};
5455

5556
// Marker component
56-
const Marker = (props) => {
57+
const Marker = ({ show, place }) => {
5758
const markerStyle = {
5859
border: '1px solid white',
5960
borderRadius: '50%',
6061
height: 10,
6162
width: 10,
62-
backgroundColor: props.show ? 'red' : 'blue',
63+
backgroundColor: show ? 'red' : 'blue',
6364
cursor: 'pointer',
6465
zIndex: 10,
6566
};
6667

6768
return (
68-
<Fragment>
69+
<>
6970
<div style={markerStyle} />
70-
{props.show && <InfoWindow place={props.place} />}
71-
</Fragment>
71+
{show && <InfoWindow place={place} />}
72+
</>
7273
);
7374
};
7475

@@ -83,7 +84,7 @@ class MarkerInfoWindow extends Component {
8384

8485
componentDidMount() {
8586
fetch('places.json')
86-
.then(response => response.json())
87+
.then((response) => response.json())
8788
.then((data) => {
8889
data.results.forEach((result) => {
8990
result.show = false; // eslint-disable-line no-param-reassign
@@ -95,7 +96,7 @@ class MarkerInfoWindow extends Component {
9596
// onChildClick callback can take two arguments: key and childProps
9697
onChildClickCallback = (key) => {
9798
this.setState((state) => {
98-
const index = state.places.findIndex(e => e.id === key);
99+
const index = state.places.findIndex((e) => e.id === key);
99100
state.places[index].show = !state.places[index].show; // eslint-disable-line no-param-reassign
100101
return { places: state.places };
101102
});
@@ -105,25 +106,26 @@ class MarkerInfoWindow extends Component {
105106
const { places } = this.state;
106107

107108
return (
108-
<Fragment>
109+
<>
109110
{!isEmpty(places) && (
110111
<GoogleMap
111112
defaultZoom={10}
112113
defaultCenter={LOS_ANGELES_CENTER}
113114
bootstrapURLKeys={{ key: process.env.REACT_APP_MAP_KEY }}
114115
onChildClick={this.onChildClickCallback}
115116
>
116-
{places.map(place =>
117-
(<Marker
117+
{places.map((place) => (
118+
<Marker
118119
key={place.id}
119120
lat={place.geometry.location.lat}
120121
lng={place.geometry.location.lng}
121122
show={place.show}
122123
place={place}
123-
/>))}
124+
/>
125+
))}
124126
</GoogleMap>
125127
)}
126-
</Fragment>
128+
</>
127129
);
128130
}
129131
}

src/examples/MarkerInfoWindowGmapsObj.js

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import React, { Component, Fragment } from 'react';
1+
import React, { Component } from 'react';
22
import isEmpty from 'lodash.isempty';
33

44
// examples:
@@ -7,7 +7,7 @@ import GoogleMap from '../components/GoogleMap';
77
// consts: [34.0522, -118.2437]
88
import LOS_ANGELES_CENTER from '../const/la_center';
99

10-
const getInfoWindowString = place => `
10+
const getInfoWindowString = (place) => `
1111
<div>
1212
<div style="font-size: 16px;">
1313
${place.name}
@@ -66,7 +66,7 @@ class MarkerInfoWindowGmapsObj extends Component {
6666

6767
componentDidMount() {
6868
fetch('places.json')
69-
.then(response => response.json())
69+
.then((response) => response.json())
7070
.then((data) => {
7171
data.results.forEach((result) => {
7272
result.show = false; // eslint-disable-line no-param-reassign
@@ -79,7 +79,7 @@ class MarkerInfoWindowGmapsObj extends Component {
7979
const { places } = this.state;
8080

8181
return (
82-
<Fragment>
82+
<>
8383
{!isEmpty(places) && (
8484
<GoogleMap
8585
defaultZoom={10}
@@ -89,7 +89,7 @@ class MarkerInfoWindowGmapsObj extends Component {
8989
onGoogleApiLoaded={({ map, maps }) => handleApiLoaded(map, maps, places)}
9090
/>
9191
)}
92-
</Fragment>
92+
</>
9393
);
9494
}
9595
}

src/examples/Searchbox.js

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import React, { Component, Fragment } from 'react';
1+
import React, { Component } from 'react';
22
import isEmpty from 'lodash.isempty';
33

44
// components:
@@ -40,7 +40,7 @@ class Searchbox extends Component {
4040
places, mapApiLoaded, mapInstance, mapApi,
4141
} = this.state;
4242
return (
43-
<Fragment>
43+
<>
4444
{mapApiLoaded && <SearchBox map={mapInstance} mapApi={mapApi} addplace={this.addPlace} />}
4545
<GoogleMap
4646
defaultZoom={10}
@@ -52,8 +52,8 @@ class Searchbox extends Component {
5252
yesIWantToUseGoogleMapApiInternals
5353
onGoogleApiLoaded={({ map, maps }) => this.apiHasLoaded(map, maps)}
5454
>
55-
{!isEmpty(places) &&
56-
places.map(place => (
55+
{!isEmpty(places)
56+
&& places.map((place) => (
5757
<Marker
5858
key={place.id}
5959
text={place.name}
@@ -62,7 +62,7 @@ class Searchbox extends Component {
6262
/>
6363
))}
6464
</GoogleMap>
65-
</Fragment>
65+
</>
6666
);
6767
}
6868
}

src/stories/ClickableMarkers/Base.stories.js

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,6 @@ export default {
88
title: 'MarkerInfo Examples',
99
};
1010

11-
1211
export const DefaultMarker = () => (
1312
<Wrapper>
1413
<MarkerInfoWindowGmapsObj />

0 commit comments

Comments
 (0)